Vue 3 在 2022 年 2 月 7 日成为新的默认版本！
vite地址 :https://vitejs.cn/guide/#scaffolding-your-first-vite-project
vu3API :https://v3.cn.vuejs.org/api/options-data.html#data-2

开发用插件

1、Vue Language Features (Volar)：Vscode 开发 vue3 必备插件，提供语法高亮提示。
2、Vue 3 Snippets：vue3 快捷输入

1、创建项目 vue项目

 # npm 6.x
 npm init vite@latest my-vue-app --template vue

 # npm 7+, 需要额外的双横线：
 npm init vite@latest my-vue-app -- --template vue

2、进入项目，安装依赖启动项目

  cd my-vue-app
  npm install
  npm run dev

3、配置环境变量 (必须 VITE_APP_ 开头)

1、新建文件.env,deveopmemt

  # .env.development
  ENV= 'development'
  VITE_APP_BASE_API = chq
  VITE_APP_app=111

2、新建文件.env.production

  # .env.production
 ENV= 'production'
 VITE_APP_BASE_API = 'http://chq'
 VITE_APP_app=111

3、package.json配置

 "scripts": {
    "dev": "vite",
    "dev:prod": "vite --mode production",
    "build": "vite build"
  }

4、获取环境变量

console.log(import.meta.env.VITE_APP_BASE_API);

1644472552(1).png

为了更方便进行技术交流，欢迎大家关注（葵花的太阳）微信公众号
码云地址：https://gitee.com/mingbaba/vue3-vite-h5.git
将持续更新