问题
ASUS@DESKTOP-TTKF7MG MINGW64 /e/webpack_vue $ webpack-dev-server --open 40% building 1/1 modules 0 activei 「wds」: Project is running at http://localhost:9000/ i 「wds」: webpack output is served from / i 「wds」: Content not from webpack is served from E:\webpack_vue\dist × 「wdm」: Hash: a90a4435e4a9138b3a3e Version: webpack 4.29.6 Time: 2348ms Built at: 2019-04-09 13:48:56 Asset Size Chunks Chunk Names app.min.js 663 KiB app [emitted] app index.html 57 bytes [emitted] Entrypoint app = app.min.js [0] multi (webpack)-dev-server/client?http://localhost:9000 ./app/js/main.js 40 bytes {app} [built] [./app/js/App.vue] 344 bytes {app} [built] [failed] [3 errors] [./app/js/home/index.vue] 344 bytes {app} [built] [failed] [2 errors] [./app/js/main.js] 216 bytes {app} [built] [./app/js/router/index.js] 216 bytes {app} [built] [./node_modules/loglevel/lib/loglevel.js] 7.68 KiB {app} [built] [./node_modules/querystring-es3/index.js] 127 bytes {app} [built] [./node_modules/strip-ansi/index.js] 161 bytes {app} [built] [./node_modules/url/url.js] 22.8 KiB {app} [built] [./node_modules/vue/dist/vue.runtime.esm.js] 222 KiB {app} [built] [./node_modules/webpack-dev-server/client/index.js?http://localhost:9000] (webpack)-dev-server/client?http://localhost:9000 8.26 KiB {app} [built] [./node_modules/webpack-dev-server/client/overlay.js] (webpack)-dev-server/client/overlay.js 3.59 KiB {app} [built] [./node_modules/webpack-dev-server/client/socket.js] (webpack)-dev-server/client/socket.js 1.05 KiB {app} [built] [./node_modules/webpack/hot sync ^./log$] (webpack)/hot sync nonrecursive ^./log$ 170 bytes {app} [built] [./node_modules/webpack/hot/emitter.js] (webpack)/hot/emitter.js 75 bytes {app} [built] + 19 hidden modules
ERROR in ./app/js/App.vue Module Error (from ./node_modules/vue-loader/lib/index.js): [vue-loader] vue-template-compiler must be installed as a peer dependency, or a compatible compiler implementation must be passed via options. @ ./app/js/main.js 2:0-28 11:2-5 @ multi (webpack)-dev-server/client?http://localhost:9000 ./app/js/main.js
ERROR in ./app/js/home/index.vue Module Error (from ./node_modules/vue-loader/lib/index.js): [vue-loader] vue-template-compiler must be installed as a peer dependency, or a compatible compiler implementation must be passed via options. @ ./app/js/router/index.js 3:0-37 11:12-16 @ ./app/js/main.js @ multi (webpack)-dev-server/client?http://localhost:9000 ./app/js/main.js
ERROR in ./app/js/App.vue Module Error (from ./node_modules/vue-loader/lib/index.js): vue-loader was used without the corresponding plugin. Make sure to include VueLoaderPlugin in your webpack config. @ ./app/js/main.js 2:0-28 11:2-5 @ multi (webpack)-dev-server/client?http://localhost:9000 ./app/js/main.js
ERROR in ./app/js/App.vue Module build failed (from ./node_modules/vue-loader/lib/index.js): TypeError: Cannot read property 'parseComponent' of undefined at parse (E:\webpack_vue\node_modules@vue\component-compiler-utils\dist\parse.js:14:22) at Object.module.exports (E:\webpack_vue\node_modules\vue-loader\lib\index.js:67:22) @ ./app/js/main.js 2:0-28 11:2-5 @ multi (webpack)-dev-server/client?http://localhost:9000 ./app/js/main.js
ERROR in ./app/js/home/index.vue Module build failed (from ./node_modules/vue-loader/lib/index.js): TypeError: Cannot read property 'parseComponent' of undefined at parse (E:\webpack_vue\node_modules@vue\component-compiler-utils\dist\parse.js:14:22) at Object.module.exports (E:\webpack_vue\node_modules\vue-loader\lib\index.js:67:22) @ ./app/js/router/index.js 3:0-37 11:12-16 @ ./app/js/main.js @ multi (webpack)-dev-server/client?http://localhost:9000 ./app/js/main.js Child html-webpack-plugin for "index.html": 1 asset Entrypoint undefined = index.html [./node_modules/html-webpack-plugin/lib/loader.js!./app/views/index.html] 20 bytes {0} [built] i 「wdm」: Failed to compile.
原因:
需要在webpack.config.js文件中配置vue-loader
参考https://vue-loader.vuejs.org/
解决办法: 安装:npm install -D vue-loader vue-template-compiler
在webpack.config.js文件中配置vue-loader:
const VueLoaderPlugin = require('vue-loader/lib/plugin')
plugins: [ // make sure to include the plugin! new VueLoaderPlugin() ]