共计 771 个字符，预计需要花费 2 分钟才能阅读完成。
介绍：
最近有一些粉丝用 guiplan 只做动态页面，但每次批改文件都要手动刷新页面，而且页面内容越来越多的时候，每次刷新页面还须要拖动滚动条能力看到成果。而用 element-ui 框架与 uniapp 框架都有对应的构建工具能实现热更新，比方 webpack,uniapp。这一章将教大家如何通过 vite 实现动态页面的热更新。也就是批改代码主动刷新页面。
步骤
- 先输出命令来装置 vite 我的项目：
npm init vite
装置过程间接按 enter 键持续即可，不必选框架如下图：
- 双击关上 vite-project 文件夹, 而后将外面的 package.json 复制进去
3. 而后粘贴到本人的动态网页文件夹中
- 有了这个 package.json 之后咱们就能够执行装置命令
npm install
装置完之后就有了 node_modules 文件夹
- 创立 vite 配置文件，文件名称必须为 vite.config.js 代码如下
import {defineConfig} from ‘vite’
export default defineConfig({
server: {
open: 'index.html'}
})
vite 构建工具会主动寻找 vite.config.js 文件，而后执行外面的代码。以上代码就是关上 index.html 动态页面。
留神：这里如果用其余的 html 文件，比方 test.html 应该这样写 /test.html 而不是./test.html 只能用绝对路径来定位文件
- 启动服务关上页面
npm run dev
- 将这个地址输出到浏览器中，而后咱们再轻易批改代码，页面就会主动刷新。
————————————————
版权申明：本文为 CSDN 博主「web 前端神器」的原创文章，遵循 CC 4.0 BY-SA 版权协定，转载请附上原文出处链接及本申明。
原文链接：https://blog.csdn.net/guige88…
正文完