深入浅出webpack 1.5章节使用Extract-text-webpack-plugin分离css
安装插件后打包提示错误 Error: Cannot find module 'webpack/lib/Chunk'
可能是webpack是4.X的原因

跟随书中步骤安装webpack会安装最新版也就是4.X版本,但是Extract-text-webpack-plugin目前(2019.3.12)仅支持到webpack3.X,想要使用的话

一种方法是使用3.x版本的webpack
另一种是使用测试版的Extract-text-webpack-plugin

我这里选用的方法是更新Extract-text-webpack-plugin的测试版
npm install -D extract-text-webpack-plugin@next

安装后再次打包依然失败,报出同样的错误

还是缺少webpack中的Chunk,于是重新安装了webpack
npm i -D webpack
再次执行打包构建,webpack提示安装CLI,输入yes或者执行npm install -D

安装后再次执行打包,打包成功

打包后在目录里面发现没有css文件,翻看前面的代码发现忘记require css文件了,在main.css中头部引入css文件
再次打包依然报错

Error: Path variable [contenthash:8] not implemented in this context: [name]_[contenthash:8].css

随即在github上官方文档的issue中找到了问题和解决办法

修改后打包成功,css也被分离了。

webpack Error: Cannot find module 'webpack/lib/Chunk' Extract-text-webpack-plugin 分离CSS的更多相关文章

  1. webpack报错:Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: Cannot find module 'babel-preset-env' from '...' - Did you mean "@babel/env"?

    webpack报错:Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: Cannot find mo ...

  2. Error: Cannot find module 'webpack/lib/node/NodeTemplatePlugin'

    在webpack的管理输出的部分,设定HtmlWebpackPlugin部分,运行npm run build 会报错 Error: Cannot find module 'webpack/lib/no ...

  3. webpack.config.js配置遇到Error: Cannot find module '@babel/core'&&Cannot find module '@babel/plugin-transform-react-jsx' 问题

    下文是网上找到的方法,是因为版本冲突的原因,参照后安装7版本解决 cnpm install -D babel-loader@ babel-core babel-preset-env 一. 问题描述 在 ...

  4. 全局安装的 webpack运行时 报错 Error: Cannot find module 'webpack' ......

    全局安装的webpack   安装指令如下 cnpm install wepack -save-dev -g 但是 在我的项目空间运行webpack指令的时候 会报如下错误 为了方便抓取{ Error ...

  5. webpack.config.js配置遇到Error: Cannot find module '@babel/core'问题

    在webpack配置,将ES6转成ES5的时候,,出现Error: Cannot find module '@babel/core'错误最初以为是babel-core没有安装上.重装了好几遍babel ...

  6. Error: Cannot find module 'webpack'错误解决

    $ npm install webpack -g $ npm install webpack-cli -g 全局安装webpack $ npm run dev Error: Cannot find m ...

  7. Webpack 4 : ERROR in Entry module not found: Error: Can't resolve './src'

    ERROR in Entry module not found: Error: Can't resolve './src' in 'E:\ASUS\Documents\VSCode files\Web ...

  8. Error: Cannot find module 'webpack/bin/config-yargs' 报错原因, webpack@4.X踩的坑~

    1 .使用webpack@4.32.2时, 当我通过package.json的script去执行webpack-dev-server时, 报以下错误:  Error: Cannot find modu ...

  9. Error: Cannot find module 'webpack'

    运行 npm start 报错 Error: Cannot find module 'webpack' 安装了 npm install --save-dev webpack cnpm install ...

随机推荐

  1. 【luogu P3953 逛公园】 题解

    题目链接:https://www.luogu.org/problemnew/show/P3953 题外话:感觉2017年神题好多..这还不是最神的一道,真在考场上我也就写个最短路计数暴力了.现在在大佬 ...

  2. ES6读书笔记(二)

    前言 前段时间整理了ES6的读书笔记:<ES6读书笔记(一)>,现在为第二篇,本篇内容包括: 一.数组扩展 二.对象扩展 三.函数扩展 四.Set和Map数据结构 五.Reflect 本文 ...

  3. node多图或者单图上传

    <form id="form" enctype="multipart/form-data"> <input type="text&q ...

  4. py基础__socket编程

    目录 Python基础__socket编程 1.计算机网络 2.socke编程 3.socketserver模块 4.思考 Python基础__socket编程 1.计算机网络 1.OSI网络七层模型 ...

  5. (Les16 执行数据库恢复)-控制文件恢复

    测试丢失所有控制文件恢复[20180517]     rman target /   show all;   configure channel 1 device type disk format ' ...

  6. jQuery的$.get()函数不执行以及php端报错Uncaught Error: Call to a member function bind_param() on boolean in...

    写了一个html,用到了jQuery,发现没有按照预期的结果显示,最后定位到是$.get()函数没有运行 调试过程为: 在页面右击查看元素,到网络那一栏,找到类型为json的那个包点击,然后查看响应, ...

  7. vim8配置python3补全

    安装Python3 卸载编译安装的python3 rm -rf /usr/local/lib/python3.7/ rm -rf /usr/local/bin/2to3* rm -rf /usr/lo ...

  8. jQuery属性操作之.val()函数

    目录 .val()实例方法的三种用法 .val()函数源码 调用形式:$('xxx').val(); 调用形式:$('xxx').val(value); 调用形式:$('xxx').val(funct ...

  9. MongoDB数据库 : 管道,用户管理,副本集等

    聚合(aggregate): db.集合.aggregate([{管道:{表达式}}]) db.集合.aggregate([ {管道1:{表达式1}}, {管道2:{表达式2}}, ... ...]) ...

  10. 浏览器窗口输入网址后发生的一段事情(http完整请求)

    1.DNS查询得到IP 输入的是域名,需要进行dns解析成IP,大致流程: 如果浏览器有缓存,直接使用浏览器缓存,否则使用本机缓存,再没有的话就是用host 如果本地没有,就向dns域名服务器查询(当 ...