安装vue-cli4+,并创建一个基于vue3.x的项目

1.vue-cli的3.0+以后使用的不是vue-cli,先卸载原来的安装

npm uninstall vue-cli -g

2.nodeJs ≧ 8.9(官方推荐 8.11.0+)


npm install -g @vue/cli

在这里插入图片描述

3.查看vue-cli版本

vue -V

在这里插入图片描述

4.vue-cli=Vue+一些js插件

在这里插入图片描述
在这里插入图片描述

5.创建vue项目

cd到你想要创建文件的目录下:

cd C:\Users\10577\Desktop\vue

在这里插入图片描述
输入

vue create 项目名称(不能含有大写字母)

在这里插入图片描述

5.1vue create 项目名称(不能含有大写字母):
在这里插入图片描述

这里是选择Manully select features:

在这里插入图片描述
5.2.Choose Vue version
选择vue的版本(我这里选择的是vue3.x)
5.3Linter / Formatter
选择:编码规则

ESLint with error prevention only 只配置使用 ESLint 官网的推荐规则 这些规则在这里添加链接描述

ESLint + Airbnb config 使用 ESLint 官网推荐的规则 + Airbnb 第三方的配置 Airbnb的规则在这里添加链接描述

ESLint + Standard config 使用 ESLint 官网推荐的规则 + Standard第三方的配置 Standard 的规则在这里 添加链接描述 
ESLint + Prettier 使用 ESLint 官网推荐的规则 +Prettier 第三方的配置 Prettier 主要是做风格统一。代码格式化工具

在这里插入图片描述

这里选择ESLint with error prevention only
在这里插入图片描述
5.4代码校验,Lint on save 保存就检查。 Lint and fix on commit 提交时检查。这里选择的是,Lint on save。

您希望在哪里放置Babel,ESLint等的配置?

Where do you prefer placing config for Babel, ESLint, etc.?
In dedicated config files #在专用配置文件中
In package.json

In dedicated config files 存放到独立文件中,In package.json 存放到 package.json 中
在这里插入图片描述
选择在package.json

5.5将此保存为预设以供将来的项目使用吗? (是/否)
建议选择N,即不保存,否则以后创建项目修改不配置不太方便

Save this as a preset for future projects? (y/N)   

选择N。
在这里插入图片描述
配置完成:
在这里插入图片描述

cd到相应的目录下:

cd xxx

执行

npm run serve

在这里插入图片描述

在这里插入图片描述

用vscode打开即可!

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值