【webpack】输入npm run dev报错： This is probably not a problem with npm. There is likely additional loggin

今天做项目的过程中，发现输入了npm run dev，报错提示。然后尝试去修改这个bug。

1、删除node_modules

rm -rf node_modules

2、删除package-lock.json文件

rm package-lock.json

npm cache clear --force  // 清除缓存

3、npm install尝试下。

对我没有什么用处。

经过查询资料，发现了作者安蝶 写的文章，原来是因为windows不支持NODE_ENV=development的设置方式。

所以，需要安装cross-env（提供一个设置环境变量的script，让你能够以linux的方式设置环境变量，然后在windows上也能兼容运行），可解决兼容性的问题。

npm install --save-dev cross-env

接着修改下package.json中的script，也就是早WEBPACK_ENV前添加cross-env

  "scripts": {
    "dev": "cross-env WEBPACK_ENV=dev webpack-dev-server --inline --port 8088",
  },

npm run dev 在尝试一下

完美解决问题。

---

---

思考：这里有一个问题，我们安装的cross-env是为了兼容windows系统的，那么如果是os系统。这种方法就不可用了。我们的代码拓展性不太好。所以，我们需要对windows系统和os系统分别做处理。

为了避免安装的cross-env带来的干扰，我们先卸载它。

npm uninstall --save-dev cross-env

package.json文件可以这样写。

  "scripts": {
    "webpack": "webpack",
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "webpack --mode production",
    "dev": "WEBPACK_ENV=dev webpack-dev-server --inline --port 8088",
    "dev_win": "set WEBPACK_ENV=dev && webpack-dev-server --inline --port 8088",
    "dist": "WEBPACK_ENV=online webpack -p",
    "dist_win": "set WEBPACK_ENV=online webpack -p"
  },

npm run dev_win 重新启动，试试看 

也可以正常启动项目。

这里为什么要这样设置，可查看 【webpack】webpack-dev-server的安装