2

我正在转换一个站点以使用 Webpack，我需要一些配置方面的帮助。我有几页是用Pug/Jade编写的，它们很大且不常访问（想想服务条款或隐私政策）。我的大部分.jade文件都是 Angular 模板，因此它们内联在它们的组件中并且效果很好。然而，这几个文件，我希望 Webpack 编译成与应用程序的其余部分分开提供的静态 HTML 文件。但是，我仍然希望他们的文件名包含哈希。

我想出的基本想法是这样的：

在routes.ts：

$routeProvider.when('/_tos', templateUrl: require('./resources/terms-of-service.jade'))

在webpack.config.js的装载机列表中：

{
  test: /resources.*\.jade$/,
  loaders: ['file?name=[name].[hash].html', 'pug-html']
}

我已经尝试了pug-loader、pug-html-loader（有和没有?exports=false选项）、html-loader、extract-loader、extract-text-webpack-plugin和file-loader 的各种组合，但我所做的一切尝试在结果.html文件中有额外的工件。例如，它可能以 . 开头module.exports =，或者它可能会放在\"文件中应该只有".

任何人都可以帮忙吗？

4

1 回答 1

1

呸！我终于弄明白了。我从根本上误解了加载程序列表的工作方式。我假设只使用了数组中匹配的第一个加载器，但没有，所有匹配的加载器都被使用。（虽然我对细节仍然很模糊。）这是一个工作配置，resources我的“资源”目录的路径在哪里：

loaders: [
  {
    test: /\.jade$/,
    include: [resources],
    loaders: ['file?name=[name].[hash].html', 'pug-html?exports=false']
  },
  {
    test: /\.jade$/,
    exclude: [resources],
    loaders: ['pug-html?doctype=html']
  }
]
于 2016-11-12T17:58:22.593 回答