您的位置:首页 > Web前端 > Vue.js

Vue3.0 - 项目初始化的两种方式

2021-09-11 12:59 597 查看

TOC

前言

最近将

vue
升级到了
3.0
,记录下
3.0
下项目初始化的两种方式


cli 脚手架升级

  • node.js
    版本

  • vue-cli
    卸载(对应
    vue2.0
    )(如果之前安装的是
    2.0
    版本,需要执行该操作卸载后升级,如果没有安装过跳到下一步直接安装)
npm uni -g vue-cli
  • vue/cli
    安装(对应
    vue3.0
cnpm i -g @vue/cli

  • cli
    版本号(
    vue3.0
    需要确保
    cli
    版本在
    4.0
    以上)
vue -V


cli 初始化3.0项目

  • 创建项目
vue create 项目名称

  • 选择自己的配置(根据自己所需,来下载所需的东西)

  • 选择
    vue3.x

  • 选择
    ESLint
    标准规则

  • Lint
    保存

  • 存到单独的配置文件

  • 是否保存以上配置步骤的选项为今后所有项目的默认配置

  • 项目创建

  • 项目目录

  • package.json
    ->
    vue
    版本

  • 运行项目
npm run serve

  • 项目访问


vite 初始化3.0项目

  • vite
    vue3
    里提供的一个开发小工具,其特点是开发阶段编译重启速度快

  • 创建项目

npm init vite-app 项目名

  • 进入项目目录,执行安装命令
npm install

  • 项目目录

  • package.json
    ->
    vue
    版本

  • 项目启动
npm run dev

  • 项目访问


- End -
梦想是咸鱼
关注一下吧
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: