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

Question

我尝试使用Webpack创建一个基于以下技术堆栈的环境：

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

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

以下是我的webpack.config.js文件https://gist.github.com/anonymous/84c02222a44ce219c35ff1a8beeff720

的要点

我到底想要实现的目标：

我有一个基于

的文件夹结构

  

  
• 应用      

      

  ./哈巴狗

           

        

  ./ components，./ views

      

    

  

我想要做的就是在视图中编译每个pug文件＆＃39;文件夹并将其转换为HTML并将其发送到dist文件夹。

你们可以帮助我吗？

感谢。

Answer 1

我终于解决了我的问题。我不记得我找到这个解决方案的确切位置，但它确实有用哈哈

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

首先，在webpack文件中将其添加到module对象： { 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$/));