Kenny 的 webpack 学习之路（二）

之前一直使用指定位置的脚本路径太长了，不方便，最好还是安装下npx 命令

npm install -g npx

之前跳过了 css样式引入这一块的内容，在学习模块热部署这一内容时，引入了css的内容，结果执行 npm run dev 命令时总是报错

ERROR in ./src/styles.css
Module build failed (from ./node_modules/css-loader/dist/cjs.js):
/Users/kenny/dev/workspace/webpack-demo/node_modules/css-loader/dist/plugins/postcss-icss-parser.js:32
      accumulator[normalizedUrl] = { ...accumulator[normalizedUrl],
                                     ^^^
SyntaxError: Unexpected token ...
    at Object.exports.runInThisContext (vm.js:76:16)
    at Module._compile (module.js:542:28)
    at Object.Module._extensions..js (module.js:579:10)

找了三个小时也没有找到到底是哪里写错了，网上也没有搜索到相应的错误处理方式，我只能认为是这个框架本身有问题，但是这个框架也不是今天才用的，以前也有人用，唯一的区别是以前用的是比较旧的版本，到官网上看看能不能找到一个合适的版本，然后我惊呆了…

4天前发布的版本，昨天我使用的时候才发布了两天。而且这更新速度真是令人咋舌。
卸载了当前版本，安装一个稳定的

npm uninstall css-loader --save-dev

npm install --save-dev css-loader@2.1.1

虽然这个错误很坑爹，但是也真的让我意识到，前端工程发展如此迅速，真的是离不开这么多社区工作者的笔耕不辍。这里还有一个不容易觉察到的细节的差异：在引入 clean-webpack-plugin 这个插件的时候发现这个引入的语法已经变更了，由原来的 const HtmlWebpackPlugin = require('html-webpack-plugin'); --> const {CleanWebpackPlugin} = require('clean-webpack-plugin'); 这个在中文网上是没有更新的，但是在 查看原文 时 我们可以看到 这个地方已经被更正为正确的语法。