一旦引入 html-webpack-plugin就报错

来源:3-2 自动化生成项目中的html页面(中)

灵感泉涌

2017-05-26 11:52






window10 ,npm版本2.14.12 ,node版本7.8.0 

不使用html-webpack-plugin的时候能够正常打包(代码应该没写错,跟视频还有html-webpack-plugin的npm主页里用法一致)

package.json里面:

"devDependencies": {

    "html-webpack-plugin": "^2.28.0",

    "webpack": "^2.3.2"

  }

webpack.config.js里面:

var HtmlWebpackPlugin = require('html-webpack-plugin');

plugins: [   new HtmlWebpackPlugin() ]


报错信息:

ERROR in   TypeError: Cannot read property '0' of undefined


  - ExternalModuleFactoryPlugin.js:19

    [Webpac-in-action]/[.2.6.1@webpack]/lib/ExternalModuleFactoryPlugin.js:19:40


  - NormalModuleFactory.js:159

    [nodejs]/[webpack]/lib/NormalModuleFactory.js:159:3


  - Tapable.js:75 NormalModuleFactory.applyPluginsAsyncWaterfall

    [nodejs]/[webpack]/[tapable]/lib/Tapable.js:75:69


  - NormalModuleFactory.js:144 NormalModuleFactory.create

    [nodejs]/[webpack]/lib/NormalModuleFactory.js:144:8


  - Compilation.js:356 Compilation.process [as _addModuleChain]

    [nodejs]/[webpack]/lib/Compilation.js:356:16


  - Compilation.js:424 Compilation.process [as addEntry]

    [nodejs]/[webpack]/lib/Compilation.js:424:7


  - SingleEntryPlugin.js:24 Compiler.compiler.plugin

    [Webpac-in-action]/[.2.6.1@webpack]/lib/SingleEntryPlugin.js:24:16


  - Tapable.js:107 Compiler.applyPluginsParallel

    [nodejs]/[webpack]/[tapable]/lib/Tapable.js:107:14


  - Compiler.js:394 Compiler.compile

    [nodejs]/[webpack]/lib/Compiler.js:394:7


  - Compiler.js:203 Compiler.runAsChild

    [nodejs]/[webpack]/lib/Compiler.js:203:7


  - compiler.js:70

    [Webpac-in-action]/[.2.28.0@html-webpack-plugin]/lib/compiler.js:70:19


  - debuggability.js:300 Promise._execute

    [Webpac-in-action]/[.3.5.0@bluebird]/js/release/debuggability.js:300:9


  - promise.js:483 Promise._resolveFromExecutor

    [Webpac-in-action]/[.3.5.0@bluebird]/js/release/promise.js:483:18


  - promise.js:79 new Promise

    [Webpac-in-action]/[.3.5.0@bluebird]/js/release/promise.js:79:10


  - compiler.js:69 Object.compileTemplate

    [Webpac-in-action]/[.2.28.0@html-webpack-plugin]/lib/compiler.js:69:10


  - index.js:47 Compiler.<anonymous>

    [Webpac-in-action]/[.2.28.0@html-webpack-plugin]/index.js:47:40


  - Tapable.js:107 Compiler.applyPluginsParallel

    [nodejs]/[webpack]/[tapable]/lib/Tapable.js:107:14


  - Compiler.js:394 Compiler.compile

    [nodejs]/[webpack]/lib/Compiler.js:394:7


  - Compiler.js:173 Compiler.<anonymous>

    [nodejs]/[webpack]/lib/Compiler.js:173:9


  - Compiler.js:302 Compiler.readRecords

    [nodejs]/[webpack]/lib/Compiler.js:302:10


  - Compiler.js:170 Compiler.<anonymous>

    [nodejs]/[webpack]/lib/Compiler.js:170:8


  - Tapable.js:67 Compiler.next

    [nodejs]/[webpack]/[tapable]/lib/Tapable.js:67:11


  - NodeEnvironmentPlugin.js:23 Compiler.<anonymous>

    [nodejs]/[webpack]/lib/node/NodeEnvironmentPlugin.js:23:3


  - Tapable.js:69 Compiler.next

    [nodejs]/[webpack]/[tapable]/lib/Tapable.js:69:14


  - CachePlugin.js:22 Compiler.<anonymous>

    [nodejs]/[webpack]/lib/CachePlugin.js:22:58


  - Tapable.js:71 Compiler.applyPluginsAsync

    [nodejs]/[webpack]/[tapable]/lib/Tapable.js:71:13


  - Compiler.js:167 Compiler.run

    [nodejs]/[webpack]/lib/Compiler.js:167:7


  - webpack.js:188 processOptions

    [nodejs]/[webpack]/bin/webpack.js:188:12


  - webpack.js:192 Object.<anonymous>

    [nodejs]/[webpack]/bin/webpack.js:192:1


写回答 关注

7回答

  • 雨巷里
    2018-03-16 10:13:40

    我也报错 同问楼主

  • 慕粉3670113
    2018-02-26 16:29:38

    我也报错

  • 慕九州4682525
    2018-02-02 14:58:00

    我也报错

  • 一鼓作气
    2017-11-15 17:26:16

    如果只全局安装的webpack就会报这错,运行npm install webpack --save-dev就可以了,具体原因不解。。。

    梦心动指o

    非常感谢,试了下还真是

    2018-03-21 16:10:14

    共 1 条回复 >

  • kjukju
    2017-09-18 14:30:45

    我这里也报错

  • 慕粉18815918109
    2017-06-16 15:49:14

    我也遇到这个问题,你解决了吗?

  • 坨坨儿
    2017-05-26 22:17:09

    HtmlWebpackPlugin应该写成htmlWebpackPlugin,这个名称是固定的,不能更改大小写和字母

webpack深入与实战

webpack实战教程,用真实项目带你探索 webpack 强大的功能

86561 学习 · 721 问题

查看课程

相似问题