Vue3之修改端口号方式

 更新时间:2023年10月17日 14:20:25   作者:怕是个神仙啊  
这篇文章主要介绍了Vue3之修改端口号方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教

方法一

在图形界面中更改参数

方法二

在 package.json 文件中修改 scripts

  "scripts": {
    "serve": "vue-cli-service serve --port 80",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },

方法三

在运行项目的时候追加端口号

npm run serve -- --port 80

方法四

在根目录下新建一个vue.config.js文件(和package.json同一目录) ,

内容如下:

module.exports = {
    devServer:{
        port:80, // 启动端口号
        open:true  // 启动后是否自动打开网页
    }
}

方法五

端口文件存放目录为:

node_modules/@vue/cli-service/lib/commands/serve.js

const defaults = {
  host: '0.0.0.0',
  port: 80,
  https: false
}

优先级:

方法一>方法二=方法三>方法四>方法五

如果方法二和方法三同时使用,且端口号设置不同,就会报错

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • vue3如何通过provide和inject实现多层级组件通信

    vue3如何通过provide和inject实现多层级组件通信

    这篇文章主要介绍了vue3如何通过provide和inject实现多层级组件通信,本文通过实例代码给大家讲解的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-11-11
  • Vue项目中使用自定义字体样式方式

    Vue项目中使用自定义字体样式方式

    这篇文章主要介绍了Vue项目中使用自定义字体样式方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-09-09
  • 浅谈Vue.js中如何实现自定义下拉菜单指令

    浅谈Vue.js中如何实现自定义下拉菜单指令

    这篇文章主要介绍了浅谈Vue.js中如何实现自定义下拉菜单指令,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-01-01
  • vue3中动态组件的踩坑记录分享

    vue3中动态组件的踩坑记录分享

    这篇文章主要为大家详细分享一下vue3中动态组件遇到的问题,分别是动态组件绑定问题和动态组件的方法导出问题,有需要的小伙伴可以参考一下
    2024-12-12
  • vue获取当前路由的五种方式示例代码

    vue获取当前路由的五种方式示例代码

    这篇文章主要给大家介绍了关于vue获取当前路由的五种方式,文中通过代码示例介绍的非常详细,对大家学习或者使用vue具有一定的参考学习价值,需要的朋友可以参考下
    2023-08-08
  • 详解vue样式穿透的几种方式

    详解vue样式穿透的几种方式

    本文主要介绍了vue样式穿透的几种方式,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-06-06
  • vue3实现高德地图天气小组件

    vue3实现高德地图天气小组件

    这篇文章主要为大家详细介绍了如何使用vue3实现一个高德地图天气小组件,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
    2024-10-10
  • Vue+SpringBoot前后端分离中的跨域问题

    Vue+SpringBoot前后端分离中的跨域问题

    在前后端分离开发中,需要前端调用后端api并进行内容显示,所以本文就介绍了Vue+SpringBoot前后端分离跨域问题,感兴趣的可以了解一下
    2021-08-08
  • Vue路由守卫详解

    Vue路由守卫详解

    路由导航守卫提供了一些钩子函数,可以在路由导航过程中进行拦截和控制,其中,beforeEach 导航守卫可以在每次路由切换前被触发,本文给大家介绍Vue路由守卫详解,感兴趣的朋友一起看看吧
    2023-10-10
  • vue实现微信分享朋友圈,发送朋友的示例讲解

    vue实现微信分享朋友圈,发送朋友的示例讲解

    下面小编就为大家分享一篇vue实现微信分享朋友圈,发送朋友的示例讲解,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-02-02

最新评论