无法使用 webpack 编译文件夹中的每个 .pug 文件

Question

我正在尝试使用基于以下技术的 Webpack 创建环境：

• pug，用于模板 HTML
• sass，用于 CSS
• ES7

但我在创建 pug HTML 文件时遇到问题。

这是我的 webpack.config.js 文件 https://gist.github.com/anonymous/84c02222a44ce219c35ff1a8beeff720 的要点

我到底想要达到什么目的：

我有一个基于

的文件夹结构

• 应用程序

  ./哈巴狗

  ./components, ./views

我想要做的是编译views文件夹中的每个pug文件并将其转换为HTML并将其发送到dist文件夹。

请你们帮帮我好吗？

谢谢。

Answer 1

我终于解决了我的问题。我不记得我在哪里找到了这个解决方案，但它确实有效，哈哈

以下是我们如何编译文件夹中的每个.pug：

首先，将其添加到您的 module 对象，在 webpack 文件中： { test: /\.pug$/, loaders: [ 'file-loader?name=[path][name].html', 'pug-html-loader?pretty&exports=false' ] },

然后将这个函数添加到webpack的入口文件中 function requireAll(r) { r.keys().filter(r => r.forEach(r)) } requireAll(require.context('./', true, /\.pug$/));