webpack npm报错-Vue（三）-webpack安装less环境报错

我新建了一个vue项目，使用下面的代码时报错。

错误信息如下：

大致意思是有依赖包没有找到。 这时我把代码中的scopedless="lang"去掉，只留下空样式，再次运行就正常显示了。 之后，我将它们添加回来，并在 chrome 中找到了它们。 错误信息显示找不到less-loader。 然后我使用npm安装less-loader，报如下错误：

大致意思是less-loader8.1.1需要webpack5.0.0的环境，less版本太低。 然后我做了以下配置：

在项目的package-lock.json的devDependency和package.json的devDependency中添加以下代码：

"less": "^3.9.0",
"less-loader": "^5.0.0",

我理解这里的package-lock.json很可能是npm安装依赖时锁定的依赖包版本webpack npm报错，而package.json是依赖包安装后的依赖包版本，所以需要此处设置，否则会用npm命令默认安装webpack npm报错，高版本仍然安装。

将以下代码添加到 webpack.base.conf.js 的模块中：

{
    test: /.less$/,
    loader: "style-loader!css-loader!less-loader"
}

然后使用npmuninstall卸载当前的less和less-loader

最后使用npm安装并指定less和less-loader

npm install -g less@3.9.0 
npm install -g less-loader@5.0.0