npm 安装vite

首先,我们安装一下 Vite 工具,这里我们只想在当前项目(vite的基本使用)下使用 Vite 对当前项目进行打包,所以我们选择局部安装:

复制代码

shell

复制代码

npm install vite -D

当然,你也可以全局安装:

复制代码

shell

复制代码

npm install vite -g

安装完 Vite 之后,我们想要用 Vite 对项目中的代码做一些处理,该怎么做呢?之前我们是通过 Live Server 插件启动的本地服务器打开的 index.html 文件,现在,我们可以把 Live Server 开启的本地服务器关了:

关掉 Live Server 的服务器后,我们再来执行 npx vite 命令(会使用局部的 vite 来搭建本地服务器)启动项目:

npx vite 执行的即 node_modules/.bin/vite 命令:

可以看到,执行 npx vite 之后,Vite 就会默认在 localhost3000 端口上给我们搭建一个本地服务(这个服务和之前的 Live Server 没有关系),我们打开这个 http://localhost:1000/

相关推荐
康王有点困1 小时前
Vue入门(Vue基本语法、axios、组件、事件分发)
前端·javascript·vue.js
zhouzhurong1 小时前
基于vue和elementui的简易课表
前端·vue.js·elementui·课程表·课表
夏天想1 小时前
element-plus 的table section如何实现单选
前端·javascript·vue.js
傻小胖1 小时前
Vue3 provide/inject用法总结
前端·javascript·vue.js
myzzb2 小时前
GPT 本地运行输出界面简洁美观(命令行、界面、网页)
前端·图像处理·人工智能·python·gpt·深度学习
前端白袍8 小时前
Nuxt:利用public-ip这个npm包来获取公网IP
网络协议·tcp/ip·npm
微臣愚钝9 小时前
前端【8】HTML+CSS+javascript实战项目----实现一个简单的待办事项列表 (To-Do List)
前端·javascript·css·html
lilu888888810 小时前
AI代码生成器赋能房地产:ScriptEcho如何革新VR/AR房产浏览体验
前端·人工智能·ar·vr
LCG元10 小时前
Vue.js组件开发-实现对视频预览
前端·vue.js·音视频
阿芯爱编程10 小时前
vue3 react区别
前端·react.js·前端框架