Vue开发环境中修改端口号的实现方法
更新时间：2019年08月15日 08:29:34 作者：StarlightUnion
这篇文章主要介绍了Vue开发环境中修改端口号的实现方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
Vue开发环境中修改端口号
如上图所示，在开发环境中，8080便是端口号，这也是使用Vue脚手架创建的项目运行时的默认的端口。
1.Vue 2.x
config文件夹中有一个index.js其中部分内容如下，port即为端口号，在这里更改即可。
module.exports = {
dev: {
env: require('./dev.env'),
port: 8080, // 端口号
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: {},
// CSS Sourcemaps off by default because relative paths are "buggy"
// with this option, according to the CSS-Loader README
// (https://github.com/webpack/css-loader#sourcemaps)
// In our experience, they generally work as expected,
// just be aware of this issue when enabling this option.
cssSourceMap: false,
}
};
2.Vue 3.x
Vue 3.x中修改端口号则需要在项目根目录下创建一个vue.config.js，内容如下。
module.exports = {
devServer: {
port: 8080, // 端口号
}
};
3.起因
Access to XMLHttpRequest at 'http://localhost:8080/sockjs-node/info?t=1565711501046' from origin 'http://192.168.0.104:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
localhost:8080/sockjs-node/info?t=1565711501046:1 Failed to load resource: net::ERR_FAILED
今天我调试练手的项目时发现报了这么个错误，当时百度了好久不得解决要领，后来想起来自己开了两个项目，一个是Vue2.x，另一个是Vue3.x，看来一下两个的端口号都是8080，冲突了。至于为什么同一个端口号能运行两个项目，是因为Vue3.0运行时会产生两个项目地址（如下图），我点了后一个......
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了vue 登录滑动验证实现代码,代码简单易懂，非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下2018-08-08
使用vue深度选择器修改ElementUI组件内样式的示例代码
在带有scoped属性的style中书写样式时，无法作用影响到子组件中的样式，此时我们会使用到deep深度选择器，来解决此问题，我们在使用less预处理器，能正常使用，但是在scss预处理器中会报错，下面通过本文介绍vue深度选择器修改ElementUI组件内样式,需要的朋友可以参考下2022-12-12
这篇文章主要介绍了详解关于vue-area-linkage走过的坑，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-06-06
vue3中ts语法使用element plus分页组件警告错误问题
这篇文章主要介绍了vue3中ts语法使用element plus分页组件警告错误问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-04-04
VSCode前端Vue项目引入Element-ui组件三步简单操作方法
elementui相当于一个库,封装好的内容,我们引入到vue项目中,就可用库中的内容,这篇文章主要给大家介绍了关于VSCode前端Vue项目引入Element-ui组件的三步简单操作方法,需要的朋友可以参考下2024-07-07
在vue中路由使用this.$router.go(-1)返回两次问题
这篇文章主要介绍了在vue中路由使用this.$router.go(-1)返回两次问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-12-12
今天小编就为大家分享一篇在vue-cli中引入lodash.js并使用详解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-11-11
浅谈ElementUI el-select 数据过多解决办法
下拉框的选项很多，上万个选项甚至更多，这个时候如果全部把数据放到下拉框中渲染出来，浏览器会卡死，体验会特别不好，本文主要介绍了ElementUI el-select 数据过多解决办法，感兴趣的可以了解一下2021-09-09
Vue.js与 ASP.NET Core 服务端渲染功能整合
本文通过案例给大家详细分析了ASP.NET Core 与 Vue.js 服务端渲染,需要的朋友可以参考下2017-11-11
这篇文章主要为大家详细介绍了vue实现面包屑的方法，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-04-04
最新评论