首页 > 其他分享 >vue项目新建 端口更改

vue项目新建 端口更改

时间:2023-09-05 16:59:16浏览次数:42  
标签:npm vue 项目 更改 端口 dev code port

vue项目新建步骤

vite创建vue3项目(最简单):

在需要的文件目录中输入cmd命令,打开命令窗口,在当前文件目录下创建项目(直接打开命令窗口,默认C盘创建项目)

第一步:npm init vite-app vue-code  //code为项目名

第二步:cd ./vue-code  //进入项目

第三步:npm install    //安装依赖包

第四步:npm run dev    //运行项目

其他方法:vue-cli创建项目、vue ui创建项目

网址参考:https://blog.csdn.net/m0_56983341/article/details/125603896

vue项目修改端口号

临时修改:

运行命令:npm run dev

加上端口参数:npm run dev --port 8888

非临时修改:

1

vue.config.jsvue.config.ts文件中增加或修改

server: {
  // 服务配置
  port: 8080,  //此处修改所需要的端口号
 },

2

package.json文件中的scripts下devsever内容之后加上--port 2222

image-20230905162938518

标签:npm,vue,项目,更改,端口,dev,code,port
From: https://www.cnblogs.com/wangkaixuan123/p/17680063.html

相关文章

  • vue3.0 el-table 动态合并单元格
    <el-tablev-resize:34style="margin:10px010px":data="tableData":header-cell-style="{background:'#F6F6F6',height:'10px','text-align':'center'}":......
  • antd限制开始时间与结束时间范围是30天,并不能选择当前日期之后的日期 vue3(默认展示近7
    <a-range-picker:value="hackValue||dateArr":disabled-date="disabledDate"style="width:240px"separator="~":allow-cl......
  • Vue3带来的新变化
    Vue3带来的新变化性能提升首次渲染更快diff算法更快内存占用更少打包体积变小更好的Typescript支持CompositionAPI (重点)在使用vue2.x版本开发较复杂的组件时,逻辑难以复用,组合式api的出现可以解决此类问题相关阅读:Vue3中文文档 https://vue3js.cn/docs/zh/......
  • Vue2 中vuex和store基本用法——取值之this.$store.getters.getValue & 修改值之this.
        参考:https://blog.csdn.net/weixin_44867717/article/details/124133304 项目实例:      ......
  • 从零开始一个vue3前端项目day04-头部导航篇
    在实际开发项目中通常会把头部导航栏写成一个通用组件,这里来具体说一下实现思路1:front-header组件就是我们的头部导航栏,路由我们已经配置好了,把每个导航的首页路径,配置成navList(包含name,path),这样就通过遍历navList就能写出一个首页导航组件 2:导航的选中状态实现,不仅仅是切......
  • 直播带货源码,vue 身份证校验js及其***显示
    直播带货源码,vue身份证校验js及其***显示校验js  constidCardRule=(rule,value,callback)=>{  letreg=/^(\d{6})(\d{4})(\d{2})(\d{2})(\d{3})([0-9]|X)$/i  if(value&&!reg.test(value)){   callback(newError('身份证号格式有误'))  }else......
  • [TRACE]Admin中描述更改的查询
     1.select*fromt_nomenwhereet_refakf_se='6567863JWA'andet_typtra='U'andet_refakf_compisnull//查询出id_nomen:2141532.select*fromt_simowhereet_nomen=214153andet_modeop_pereisnullandsimo_fin_validiteisnull//查询出id_s......
  • vue--day77--路由的简介
    1.vue-router的理解vue的一个插件库专门用来实现SPA应用2.SPA应用的理解单页web应用,(singlepagewebapplication SPA)整个页面只有一个完整的页面点击页面中的导航链接不会刷新页面只会做页面的局部更新数据需要通过ajax请求获取3.路由的理解1.理解:一个路由......
  • 今天练习element组件的时候,引入element样式和脚本文件以及vue的组件之后,导入简单eleme
    2023-09-04今天练习element组件的时候,引入element样式和脚本文件以及vue的组件之后,导入简单element组件练习之后,查看组件的时候,样式一直出不来,经过我多次排查,终于发现,导入的三个内容是有顺序排序要求的。必须先导入vue,然后再导入其他的两个。<!DOCTYPEhtml><htmllang="en">......
  • Vue 3 之 Element Plus 之 Pagination 的 坑
    版本信息:vue.js3.3.4ElementPlus2.3.12浏览器ChromeVersion116-- 坑描述试验ElementPlus之分页时,出现了异常——之前开发的弹窗打不开了。 Pagination分页:https://element-plus.org/zh-CN/component/pagination.html 在页面加里了一些弹窗(对话框):<el-......