Vite 安装 jQuery
什么是 Vite？
Vite 是一款基于 ES Module 的开发服务器，专为现代浏览器原生模块系统而构建的。它具有快速冷启动、即时的模块热更新、按需编译等特点，可以极大地提高前端开发的效率。
为什么要使用 Vite？
Vite 在开发过程中可以实现零配置的开箱即用，同时还可以充分利用浏览器原生的 ES Module 功能，避免了传统开发中打包和构建的繁琐过程。在开发过程中，Vite 可以实现快速的冷启动，允许你在浏览器中进行实时的模块热更新，同时还能够按需编译，只编译当前正在编辑的模块，大大提高了开发效率。
如何安装 Vite？
要安装 Vite，首先需要确保你已经安装了 Node.js。然后，打开终端，执行以下命令来全局安装 Vite：
npm install -g create-vite
安装完成后，你可以使用以下命令来创建一个新的 Vite 项目：
create-vite my-project
这将会在当前目录下创建一个名为 my-project 的文件夹，并自动安装项目的依赖。
进入项目文件夹，并运行以下命令启动 Vite 服务器：
cd my-project
npm install
npm run dev
Vite 会在终端中显示一个本地开发服务器的地址，你可以在浏览器中打开该地址，即可访问你的项目。
在 Vite 中安装 jQuery
在 Vite 中安装 jQuery 相当简单，我们只需要使用 npm 或者 yarn 来安装即可。在终端中，进入你的项目文件夹，并执行以下命令：
npm install jquery
或者使用 yarn：
yarn add jquery
安装完成后，你可以在你的代码中引入 jQuery：
import $ from 'jquery';
现在，你可以使用 $ 来操作和访问 DOM 元素了。
示例代码
下面是一个使用 Vite 安装了 jQuery 的示例代码：
// main.js
import $ from 'jquery';
$(document).ready(function() {
// 在页面加载完成后执行以下代码
$('button').click(function() {
alert('Hello, Vite with jQuery!');
});
});
上述代码中，我们在页面加载完成后，给所有的按钮添加了一个点击事件，点击按钮时会弹出一个带有文字的提示框。
关系图
下面是一个简单的关系图，表示 Vite 和 jQuery 之间的关系：
erDiagram
Vite --|> ES Module
ES Module --|> JavaScript
jQuery --|> JavaScript
jQuery --|> DOM
DOM --|> HTML
总结
本文介绍了如何使用 Vite 安装 jQuery，并提供了示例代码和关系图。Vite 是一个非常方便快捷的开发工具，可以极大地提高前端开发的效率。安装和使用 jQuery 也变得非常简单，你可以在你的 Vite 项目中随时使用 jQuery 来操作和访问 DOM 元素。希望本文对你有所帮助，祝你编写出更好的前端应用！
