如何将使用 Less CSS 的项目部署到 Heroku？
我在本地开发中使用较少的 CSS 来处理我的 Django 站点。一切看起来都很好。我包含的文件如下：
<link rel="stylesheet/less" type="text/css" href="{{ STATIC_URL }}less/base.less">
<script src="{{ STATIC_URL }}js/less-1.1.3.min.js" type="text/javascript"></script>
但是，当我将项目部署到 Heroku 时，Less CSS 莫名其妙地不起作用。我有什么错吗？
我知道我已经正确设置了静态媒体：我可以从正确的路径下载 base.less 和 less-1.1.3.min.js 。
注意：我意识到最好编译并缩小 .less 文件以进行生产，但这只是用于开发目的的临时服务器。
注 2：如果您知道如何将 Less CSS 编译添加到 Heroku 部署过程中，而不必安装 Node.js，那么除了我的主要问题之外，我还有兴趣学习如何做到这一点。
I have Less CSS working with my Django site in local development. Everything looks fine. I'm including the files as follows:
<link rel="stylesheet/less" type="text/css" href="{{ STATIC_URL }}less/base.less">
<script src="{{ STATIC_URL }}js/less-1.1.3.min.js" type="text/javascript"></script>
However, when I deploy the project to Heroku, Less CSS inexplicably doesn't work. What do I have wrong?
I know for a fact that I have static media set up properly: I can download base.less and less-1.1.3.min.js from the correct paths just fine.
Note: I realize that it's best to compile and minify my .less files for production, but this is just a staging server for development purposes.
Note 2: If you know how to add compilation of Less CSS to the Heroku deployment process, without having to install node.js, I'd be interested in learning how to do that in addition to my main question..
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
问题是 less.js 通过 XHR 加载 .less 样式表，除非您设置适当的 Access-Control-Allow-Origin 标头，否则该样式表不起作用，而 S3 不允许这样做 (https://forums.aws.amazon .com/thread.jspa?threadID=34281）。
作为一种解决方法，有些人建议设置 HTTP 代理，这会添加必要的标头。 （http://motoole.com/2011/10/19/hosting-font-face-fonts-on-s3.html）和（http://zefer.posterous.com/pure-html-ajax-solutions-to -upload-files-to-s)
否则，您将必须将 .less 文件编译为 CSS，因为 less.js 无法工作。
当然，另一种选择（我使用的）是简单地将静态文件部署到 Apache 服务器，而不是将它们托管在 S3 中。
The problem is that less.js loads the .less stylesheets through XHR, which doesn't work unless you set the appropriate Access-Control-Allow-Origin header, which S3 doesn't permit (https://forums.aws.amazon.com/thread.jspa?threadID=34281).
As a workaround some people have suggested setting up an HTTP Proxy, which adds the necessary header. (http://motoole.com/2011/10/19/hosting-font-face-fonts-on-s3.html) and (http://zefer.posterous.com/pure-html-ajax-solutions-to-upload-files-to-s)
Otherwise, you're going to have to compile the .less files to CSS, as less.js isn't going to work.
Of course, another alternative (which I use), is to simply deploy the static files to an Apache server, and not host them in S3.
看看 https://github.com/nigma/heroku-django-cookbook
它利用
heroku-buildpack-python提供的post_compile钩子来安装nodejs和lessc。Take a look at https://github.com/nigma/heroku-django-cookbook
It makes use of the
post_compilehook provided byheroku-buildpack-pythonto installnodejsandlessc.