Grunt、云部署和编译文件

Question

我最近开始探索 grunt，我通过尝试 https://github.com/ng-vu/ng-express-boilerplate种子。

它使用 gruntfile 将静态资源、css、javascript 复制到目标文件夹，代码如下：

dist_js: {
    files: [{
        src: ['<%= app_files.js %>', '<%= vendor_files.js %>'],
        dest: '<%= dist_dir %>/public',
        cwd: '.',
        expand: true
     }]
}

其中 dist_dir 是“dist”。

现在在配置文件中指定在开发中我们要从原始位置提供 assets、src 和 vendor 文件，因此 express 用于开发的配置如下：

app.use('/assets', express.static(path.resolve(__dirname, '../assets')));
app.use('/src', express.static(path.resolve(__dirname, '../../src')));
app.use('/vendor', express.static(path.resolve(__dirname, '../../vendor')));

在生产中，代码是：

app.use(express.static(path.join(__dirname, 'public')));

当我将它转移到生产环境（特别是 openshift）时，index.html 模板提供了所有脚本和链接标签，但找不到脚本和 css。例如，我得到的是“无法获取 file.css”。

我在云端运行 grunt build 和编译，输出为“完成，没有错误”，但找不到文件。我已经尝试了太多的东西，但我已经没有想法了。我错过了关于 grunt 的一些基本知识吗？

编辑： 问题是执行路由的 javascript 文件位于 src/server 内，因此 __dirname 指向该位置。然而，Grunt 在项目根目录中进行了复制。

app.use(express.static(path.join(__dirname, '../../dist/public')));

这解决了问题。

Answer 1

您需要使用路由公开您的资产。

app.use(express.static(path.join(__dirname, 'dist/public')));

运行 npm install 后，您需要修改 package.json 文件以调用 grunt。为此，请添加以下内容。

"scripts": {
    "start": "node ./src/server/app.js",
    "postintall": "grunt build; grunt compile"
}

另外，最好定义一个新的 grunt 任务来结合这两个任务。

Gruntfile.js

grunt.registerTask("prep-for-cloud", [ "compile", "build" ]);

那么您的package.json 将如下所示。

"scripts": {
    "start": "node ./src/server/app.js",
    "postintall": "grunt prep-for-cloud"
}

您还应该将grunt-cli 作为依赖项添加到您的package.json 文件中。