Foundation 5 生产环境文件

Question

我使用foundation new myproject --libsass 方法创建了一个新的基础项目。

它只是一个简单的静态 index.html（为了这个问题的目的）。

我现在已经将它部署到实时服务器上，我想知道构建它的最佳方式。我省略了 node_modules 和 scss 目录，只剩下以下内容：

• bower_components/
• css/
• js/
• index.html
• bowerrc
• bower.json
• Gruntfile.js
• humans.txt
• package.json
• README.md

bower_components 需要其当前形式，除非我将一些文件打乱，这是我打算做的，但我正在检查是否有更好的方法来做到这一点，并且我没有错过一些用于部署到生产环境的神奇终端命令。

Answer 1

正如 cmets 中的 msturdy 所建议的，grunt 是这里的最佳选择。那里有很多插件，请在官方页面上查看list。

如果您想让 grunt 将您的项目“编译”到一个特定的文件夹中，然后您可以将其推送到部署服务器，您应该在 grunt 中做几件事：

1. 编译你的 scss
2. 缩小你的 javascript，即使文件更小，参见jscompress 的演示。您在项目中包含的 /bower_components 中的所有 js 文件都应该位于首先加载的 vendor.js 中，然后第二个 js 文件应该包含来自 /js 的自定义 js
3. 将所有内容保存到部署文件夹中。
4. （可选）自动部署到服务器。

看看这些用于设置 gruntfile.js 的 grunt 教程，您将需要两个任务，一个用于快速编译您的 scss，另一个用于整个部署过程：

• grunt is not weird and hard
• official tutorial
• sitepoint tutorial

它们向您展示了如何做某些事情，以及如何编写 gruntfile。除了当前的 libsass 插件之外，您可能还想使用的插件是 uglify 和任何允许您通过 git、ftp 或其他任何方式部署代码的插件。您可以通过 npm 下载所有这些插件，将它们添加到您的 package.json 并执行 npm install，请参阅他们的网站以获取确切的使用说明。