深入浅出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. js如何将一个json数组对应放置到另一数组中去

    需要将上面这个数组的每一个元素对应添加至下面的数组中 最后合成为这样的数组: 使用for循环,将第一个数组中的元素循环到第二个数组中

  2. Java I/O系列（一）InputStream与OutputStream源码分析及理解

    1. InputStream 定义 字节输入流,是一个抽象类,核心是通过read()方法,从数据源中读取一个个字节出来,另有skip,mark功能 核心源码理解 源码: public abstract ...

  3. java spring-WebSocket json参数传递与接收

    Websocket原理(摘抄) 一.websocket与http WebSocket是HTML5出的东西(协议),也就是说HTTP协议没有变化,或者说没关系,但HTTP是不支持持久连接的(长连接,循环 ...

  4. Linux启动流程(CentOS6)

    内核级别: (POST)BIOS加电自检-->(Boot Sequence)从BIOS中读取启动顺序-->读取MBR中的bootloader-->加载内核-->读取伪根--&g ...

  5. Mysql存中文字符出错：Incorrect string value: '\xC2\xE9\xD7\xED\解决方法

    1.数据库连接设置编码格式为UTF-8 jdbc:mysql://localhost:3306/jbpm_test?useUnicode=true&characterEncoding=UTF- ...

  6. jQuery|简单tab栏切换

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. iOS开发者证书-详解/生成/使用

    本文假设你已经有一些基本的Xcode开发经验, 并注册了iOS开发者账号. 相关基础 加密算法 现代密码学中, 主要有两种加密算法: 对称密钥加密 和 公开密钥加密. 对称密钥加密 对称密钥加密(Sy ...

  8. 海思平台交叉编译curl支持SSL功能

    1.准备工具 1).交叉编译工具 2).下载libcurl和openssl源代码,我使用的是(openssl-1.0.2o.tar,curl-7.59.0.tar) 3).查看cpu详细 ~ # ca ...

  9. 内置函数--eval

    eval参数是一个字符串, 可以把这个字符串当成表达式来求值, 比如'x+2'就是一个表达式字符串>>> x = 2>>> print (eval('x+2'))2 ...

  10. 批处理之 for /f 中的delims和tokens

    0x00 前言 今天在对windows进行提权之前的系统信息收集的时候,需要使用到一条批处理语句把特定部分的内容从一个txt的文本当中提取出来:该条语句是如下: for /f "tokens ...