Question

我正在尝试使用基于webpack的管道完全替换rails资产管道。我已经使用webpack-dev-server和热重装等开发工具设置得非常漂亮。现在我想要实现的是生产的编译步骤，它将模仿rails如何编译资产（消化/生成兼容的manifest.json文件），这样我仍然可以使用javascript_include_tag等帮助程序。这是我被卡住了。

我已经阅读了许多有关使用带有rails的webpack的教程，但他们最终都编写了自己的视图助手来加载资源。我试图避免这种情况，因为我不想要额外的开销或者开发人员需要了解不同的管道。我还希望像asset_host=这样的配置能够开箱即用，以便使用CDN等。

最终，我想要的是与gulp-rev-rails-manifest类似的东西，它在编译时生成与rails-asset-pipeline兼容的清单文件，但我还没有找到Webpack存在的插件。所以......

是否可以通过gulp stream 仅使用webpack运行webpack构建（即不使用gulp-webpack），所以我可以使用上面的gulp插件。我不想使用gulp-webpack的原因是它接管你的条目/输出等，我发现整个设置令人困惑，因为这一切都已经存在于webpack.config

或

有没有人在为Webpack编写插件时有任何不错的资源。对我来说这似乎有点黑盒子，官方网站有一个“如何编写插件”的菜单部分，但它实际上并不是指向任何内容的链接。

或者

实际上是否有一个插件可以完成此操作，我不知道如何正确搜索互联网。

非常感谢任何帮助：）

Answer 1

在gulp任务中运行webpack是very simple：

var webpack = require('webpack');
var webpackConfig = require('./webpack.config');

gulp.task('webpack', function(done) {
  webpack(webpackConfig, function(err, stats) {
    done(err);
  });
});

请注意，提供给webpack回调的stats对象包含有关webpack发出的所有资产的信息，因此您可以使用它来生成自己的清单。

以下是一些您可能会觉得有用的webpack插件：

虽然没有关于如何创建插件的官方教程，但仍然有一个Plugin API文档描述了插件可以挂钩的不同接口。 webpack source和github包含很多webpack插件示例。

这是一个非常简单的插件，只记录资产：

module.exports = function() {
  this.plugin('done', function(stats) {
    console.log(stats.toJson().assets);
  });
};

适用于rails资产的Webpack插件清单

1 个答案: