这段报错信息意思是Dev Server已使用与API模式不匹配的选项对象初始化,其中明确指出是属性 disableHostCheck,于是我屏蔽了这个属性,发现能启动成功
此时我查看了之前和这次的项目的webpack的版本发现这次的版本是 webpack5 之前是webpack4,并且查看了webpack的文档发现
disableHostCheck 这个属性在webpack4中已经被删除替换,webpack5中已经不存在这个属性了,所以配置这个会报错,正确做法是替换成allowedHosts
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
//基本路径
publicPath: process.env.NODE_ENV === 'production' ? './' : '/',
//输出目录
outputDir: 'dist',
//指定生成的文件
indexPath: 'index.html',
//vue兼容ie
transpileDependencies: true,
//是否启用eslint验证
lintOnSave: false,
//开发环境配置
devServer: {
//允许别人访问自己的ip地址
host: '0.0.0.0',
allowedHosts: "all",
//代理配置
proxy: {
'/api': {
target: 'https://192.168.x.xxx:8080/',//接口的域名
ws: true,//是否代理websockets
secure: false,//是否是https接口
changeOrigin: true,//是否跨域
pathRewrite: {//重写地址,将前缀/api转为""
'^/api': ""
}
}
}
}
})
移动端显示配置
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />