解决:Webpack4 打包时css样式文件为空

起因

npm upgrade

因为每次都提示有包更新,所以更新了包。然后就出现

static/css/1.1dfe7c7.css    0 KiB       1  [emitted]   vendors~app 

调查

于是我看了一下,CSS打包是用的 "extract-text-webpack-plugin": "^4.0.0-beta.0" , 好像当时也是因为有问题才切这个Beta版本的,
去Npmjs上查了一下,果然:

解决:Webpack4 打包时css样式文件为空_第1张图片
人家这个包已经不支持了,所以更新了会出问题。于是按照推荐更换新的包:"mini-css-extract-plugin": "^1.3.1",

代码如下:

const MiniCssExtractPlugin = require('mini-css-extract-plugin');
rules: [
    {
       test: /\.(c|le)ss$/,
       use: [
          MiniCssExtractPlugin.loader,
         'css-loader',
         'less-loader',
       ],
     },
]

结语

建议大家生产环境不要把 ^ 符号放开,这样它就不会去升级了,固定版本号。

你可能感兴趣的:(异常,开发工具相关,webpack,css)