三步开启无框架原生h5开发热更新服务器vite

146 阅读1分钟

image.png

这种项目做开发,我想要hmr(热更新)

image.png

不逼逼赖赖,直接说方法

第一步

npm init && pnpm add vite -D

第二步

修改package.json文件,在script中添加"dev": "vite --host"

第三步

npm run dev

为什么

说一下为什么:

vite开发模式就是一个静态文件服务器,但是它会去拦截文件去做处理,不过因为没有给配置文件和其他的插件,所以不会有什么其他的处理

服务开启以后你在地址输入你的文件路径和就行了

举个例子:

root

  • package.json
  • web
    • index.html

开启服务以后,你要打开index.html文件

那就是http://127.0.0.1:5173/web/index.html

vite默认端口是5173,