如何创建 且在idea中操作vue3项目

一，使用vue的控制台创建vue3项目

1，首先使用vue的控制台创建基础的vue框架

①win+r 唤出控制台，输入cmd

②在控制台中输入 vue ui

③弹出一个网页窗口，在弹出的窗口中点击下面这个地方

④选择你要存放的地址，点击再次创建项目

⑥输入项目文件夹名称，取消勾选初始化git仓库，点击下一步

⑦选择手动，点击下一步

⑧两勾选一取消，点击下一步

这是原本界面：

入下图这样两勾选一取消：

⑨选择vue版本，我这里选择vue3，勾选上下面这条选择开启历史记录

⑩可以选择保存预设，下次直接选择预设方案创建，就不用每次手动创建了，也可不保存预设

2，使用idea操作vue项目

①打开idea，选择file导航栏，选择open子导航栏

②选择刚才创建的vue项目的文件夹点击ok打开

③可以点击new window 打开一个新的窗口

④点击terminal控制台，根据界面上的提示，在控制台中输入npm run serve运行此项目

当然也可以选择另一种运行方式：
将导航栏显示出来

点击添加配置

点击➕，选择npm

输入serve，点击apply应用，点击ok确定

然后就可以在导航栏运行

3，其他的一些细节

①，如果你使用前后端分离的方式开发，你的后端启动类一般需要解决跨域问题

跨域问题：在控制层Controller类上加注解@CrossOrigin解决

②，还有就是你的前端和后端同时启动有可能会出现端口后被占用的情况

spring boot项目需要去yml配置文件中添加如下代码修改端口号

server:
  port: 8082

前端vue代码的话需要再package.json这个配置文件中修改，将如下代码修改：

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

在serve后台添加 （–port 端口号） ， 修改为：

  "scripts": {
    
    
    "serve": "vue-cli-service serve --port 端口号 ",
    "build": "vue-cli-service build"
  },

然后就可以修改前端的端口号了