作者:小花诸葛_630 | 来源:互联网 | 2023-08-29 17:58
原文地址:Vite?-Vueno-bundlerdevsetup众所周知,EvanYou(Vue.js创建者)某天晚上都毫无睡意,因此创建了Vite。Vite允许你使用单页组件开发
众所周知,Evan You(Vue.js创建者)某天晚上都毫无睡意,因此创建了Vite。
Vite允许你使用单页组件开发Vue应用,而不需要任何的打包步骤。浏览被要求使用Imports就像使用原生ES那样导入模块。dev server可以在运行的时候对.vue文件进行拦截并编译它们,而且速度很快。
请注意,Vite 是试验性的 ?? ,我不知道Vite未来会怎么样或者这篇文章的有效时间会持续多久。但是,把它当作未来的快餐或者一些有趣的东西。
让我们尝试一下
创建如下文件
Comp.vue
index.html
然后执行命令:
npx vite
访问 http://localhost:3000, 编辑.vue文件使之变化来查看热重载.
Bundle for Production
现在,让我们来构建生产环境下的app
新建package.json
{
"scripts": {
"build": "vite build"
}
}
执行命令
npm i -D vite
npm run build
检查一下dist文件夹下的代码
我偶然发现的问题
- Error: Cannot find module ‘tslib‘
- Error: ENOENT: no such file or director
感想
这很容易上手,开发过程也很快,同时我能够实时看到更改后的变化。这就像在运行时进行编译。因此,这看起来很有希望,可能以后,这将成为我们开发所有Vue项目的方式。
Evan You,继续你的魔法 ??
有趣的事实:在法语中 vue = view , vite=fast
修改: 看起来Vite现在已经有了结论,等到Vue 3.0推出之后,Vite将会/可能会被选中使用。但是,如果你想现在使用Vue 3 beta版本的话,这是最简单的方法。
修改2: 这是我根据Evan You的推文得出的结论。查看仓库的代码提交,我猜测它仍然在开发中 ??
Vite? - Vue no-bundler dev setup(译)