笔记

vite /vit/:
是新一代的构建工具。

老一代的构建工具 是 webpack 。

视频文档

官方文档:
https://v3.cn.vuejs.org/guide/installation.html#vite

vite官网:
https://vitejs.cn

  • 什么是vite?—— 新一代前端构建工具。
  • 优势如下:
    • 开发环境中,无需打包操作,可快速的冷启动。
    • 轻量快速的热重载(HMR = hot module replacement)。
    • 真正的按需编译,不再等待整个应用编译完成。
  • 传统构建 与 vite构建对比图
    webpack构建:

    138_使用vite创建工程 - 图1


    vite构建:

    138_使用vite创建工程 - 图2

## 创建工程
npm init vite-app <project-name>

## 进入工程目录
cd <project-name>

## 安装依赖
npm install

## 运行 ★★★
npm run dev

问题

  • 如果 npm run dev 提示 [vite] (client) Pre-transform error: Failed to parse source for import analysis because the content contains invalid JS syntax. Install @vitejs/plugin-vue to handle .vue files.
    需要安装 vue3 :
    npm i vue