一、检查配置文件
当我们运行npm run serve时，很多时候是因为配置文件出现了问题而导致报错。
1、package.json
{
"name": "example",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"core-js": "^3.8.1",
"vue": "^2.6.11"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^4.5.9",
"@vue/cli-plugin-eslint": "^4.5.9",
"@vue/cli-service": "^4.5.9",
"babel-eslint": "^10.1.0",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^7.0.0",
"vue-template-compiler": "^2.6.11"
}
}我们先检查一下package.json文件是否存在，是否缺少某些依赖包。
2、vue.config.js
module.exports = {
devServer: {
port: 8080,
open: true,
proxy: {
'/api': {
target: 'http://localhost:3000',
ws: true,
changeOrigin: true
}
}
}
}检查vue.config.js文件是否有问题，如端口号是否配置正确，代理是否配置正确等等。
二、检查环境变量
在运行npm run serve时，环境变量也可能会出现问题。
1、NODE_ENV
"scripts": {
"serve": "cross-env NODE_ENV=development vue-cli-service serve",
"build": "cross-env NODE_ENV=production vue-cli-service build",
"lint": "vue-cli-service lint"
}检查一下NODE_ENV是否正确配置。
2、BASE_URL
module.exports = {
publicPath: process.env.NODE_ENV === 'production'
? '/production-sub-path/'
: '/'
}检查一下是否有配置正确的BASE_URL。
三、升级依赖包版本
运行npm run serve时，有可能是因为依赖包版本的问题而导致出错。需要先更新依赖包版本。
使用npm-check-updates进行依赖包版本的升级。安装npm-check-updates：
npm install -g npm-check-updates升级依赖包：
npx ncu -u更新完毕后，重新安装依赖包：
npm install四、更新node版本
npm run serve可能会因为node版本过低而导致出错。需要先更新node版本。
使用n工具进行node版本的管理。安装n：
npm install -g n使用n进行node版本的安装及切换：
n stable
n 16.13.2安装完毕后，在项目目录下重新运行npm install，然后运行npm run serve。
原创文章，作者：小蓝，如若转载，请注明出处：https://www.506064.com/n/280331.html
微信扫一扫 
支付宝扫一扫 