前端_008_Vite

来源：尚佳旅游分享网

官网：https://vitejs.cn/vite3-cn/guide/

一句话简介：前端的一个构建工具

Vite项目结构

#新建一个vite项目 
npm create vite@latest

原有项目引入vite需要

1.index.html移至根目录

2.新增vite.config.js文件

3.npm install vite

第一次使用vite后会将依赖预缓存到node_modules/.vite

只有在上述其中一项发生更改时，才需要重新运行预构建。

支持自动依赖搜寻

如果没有找到相应的缓存，Vite 将抓取你的源码，并自动寻找引入的依赖项（即 “bare import”，表示期望从 node_modules 解析），并将这些依赖项作为预构建包的入口点

作用：

1.兼容CJS和UMD，统一转换为ES模块使用，当转换 CommonJS 依赖时，Vite 会执行智能导入分析，这样即使导出是动态分配的（如 React），按名导入也会符合预期效果

// 符合预期
import React, { useState } from 'react'

2.Vite 将有许多内部模块的 ESM 依赖关系转换为单个模块

https://vitejs.cn/vite3-cn/guide/using-plugins.html#conditional-application

插件部分根据具体项目需要参考官网引入即可

因篇幅问题不能全部显示，请点此查看更多更全内容

查看全文