问题描述
首先让我分解项目设置/我要做的事情：
文件结构：
- index.md
- index.pug
- image.jpg
Here is a local image (we want webpack's file loader to get triggered on it,and replace the local path with a bundled resource hash):
在哈巴狗模板中，内插markdown：
include:markdown-it(html,linkify) ./index.md
现在，Webpack 4出现了。这是我的（大约）配置：
插件：
new HtmlWebpackPlugin({
template: './src/index.pug'
}),规则：
{
test: /\.pug$/,loaders: [
// html loader gets webpack to process <img> src
'html-loader',// requires pretty option otherwise some spacing between elements is lost
'pug-html-loader?{"interpolate":true,"pretty":true,"exports":false}'
],}
应该怎么回事：
Webpack应该生成一个index.html文件，看起来像这样：
<img src='a_generated_resource_hash.jpg` alt=''>
查看以下答案：
现在，当我运行webpack时，出现以下错误：
Child HtmlWebpackCompiler:
1 asset
Entrypoint HtmlWebpackPlugin_0 = __child-HtmlWebpackPlugin_0
[./node_modules/html-webpack-plugin/lib/loader.js!./src/index.pug] 500 bytes {HtmlWebpackPlugin_0} [built] [Failed] [1 error]
ERROR in ./src/index.pug (./node_modules/html-webpack-plugin/lib/loader.js!./src/index.pug)
Module build Failed (from ./node_modules/pug-html-loader/lib/index.js):
TypeError: require is not a function
at eval (eval at wrap (/mnt/c/Users/arcop/git/yardwork-site/node_modules/pug-runtime/wrap.js:6:10),<anonymous>:26:752)
at template (eval at wrap (/mnt/c/Users/arcop/git/yardwork-site/node_modules/pug-runtime/wrap.js:6:10),<anonymous>:34:689)
at Object.module.exports (/mnt/c/Users/arcop/git/yardwork-site/node_modules/pug-html-loader/lib/index.js:33:10)
紧邻上面是更长，更详细的堆栈跟踪：
ERROR in Error: Child compilation Failed:
Module build Failed (from ./node_modules/pug-html-loader/lib/index.js):
TypeError: require is not a function
- TypeError: require is not a function
- ModuleBuildError: Module build Failed (from ./node_modules/pug-html-loader/lib/index.js):
- TypeError: require is not a function
- index.js:33 Object.module.exports
[yardwork-site]/[pug-html-loader]/lib/index.js:33:10
- normalModule.js:316 runLoaders
[yardwork-site]/[webpack]/lib/normalModule.js:316:20
- LoaderRunner.js:367
[yardwork-site]/[loader-runner]/lib/LoaderRunner.js:367:11
- LoaderRunner.js:233
[yardwork-site]/[loader-runner]/lib/LoaderRunner.js:233:18
- LoaderRunner.js:143 runSyncOrAsync
[yardwork-site]/[loader-runner]/lib/LoaderRunner.js:143:3
- LoaderRunner.js:232 iteratenormalLoaders
[yardwork-site]/[loader-runner]/lib/LoaderRunner.js:232:2
- LoaderRunner.js:205 Array.<anonymous>
[yardwork-site]/[loader-runner]/lib/LoaderRunner.js:205:4
- CachedInputFileSystem.js:55 Storage.finished
[yardwork-site]/[enhanced-resolve]/lib/CachedInputFileSystem.js:55:16
- CachedInputFileSystem.js:91 provider
[yardwork-site]/[enhanced-resolve]/lib/CachedInputFileSystem.js:91:9
- graceful-fs.js:115
[yardwork-site]/[graceful-fs]/graceful-fs.js:115:16
- read_file_context.js:53 FSReqWrap.readFileAfterClose [as oncomplete]
internal/fs/read_file_context.js:53:3
- child-compiler.js:131 childCompiler.runAsChild
[yardwork-site]/[html-webpack-plugin]/lib/child-compiler.js:131:18
- Compiler.js:343 compile
[yardwork-site]/[webpack]/lib/Compiler.js:343:11
- Compiler.js:681 hooks.afterCompile.callAsync.err
[yardwork-site]/[webpack]/lib/Compiler.js:681:15
- Hook.js:154 AsyncSeriesHook.lazyCompileHook
[yardwork-site]/[tapable]/lib/Hook.js:154:20
- Compiler.js:678 compilation.seal.err
[yardwork-site]/[webpack]/lib/Compiler.js:678:31
- Hook.js:154 AsyncSeriesHook.lazyCompileHook
[yardwork-site]/[tapable]/lib/Hook.js:154:20
- Compilation.js:1423 hooks.optimizeAssets.callAsync.err
[yardwork-site]/[webpack]/lib/Compilation.js:1423:35
- Hook.js:154 AsyncSeriesHook.lazyCompileHook
[yardwork-site]/[tapable]/lib/Hook.js:154:20
- Compilation.js:1414 hooks.optimizeChunkAssets.callAsync.err
[yardwork-site]/[webpack]/lib/Compilation.js:1414:32
- Hook.js:154 AsyncSeriesHook.lazyCompileHook
[yardwork-site]/[tapable]/lib/Hook.js:154:20
- Compilation.js:1409 hooks.additionalAssets.callAsync.err
[yardwork-site]/[webpack]/lib/Compilation.js:1409:36
require is not a function向我暗示，ES6 javascript管道中的某个地方正与Commonjs混为一谈，但是我真的还不够了解。
不幸的是，我完全不懂我的意思。完全不支持我尝试配置事物的方式。任何想法/建议都非常感谢！
解决方法
暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！
如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@）