是什么尤大选择放弃Webpack？——vite 原理解析

本文同步在掘金博主:「橙红年代」个人博客shymean.com上。

掘金原文链接: https://juejin.im/post/5ea2361de51d454714428b44

前些天尤大在Vue 3.0 beta直播中提到了一个vite的工具，其描述是：针对Vue单页面组件的无打包开发服务器，可以直接在浏览器运行请求的vue文件，对其原理比较感兴趣，因此体验并写下了本文，主要包括vite实现原理分析和一些思考。

预备知识

vite重度依赖module sciprt的特性，因此需要提前做下功课，参考：JavaScript modules 模块 - MDN。

module sciprt允许在浏览器中直接运行原生支持模块

<script type="module">    // index.js可以通过export导出模块，也可以在其中继续使用import加载其他依赖     import App from  ./index.js script>

当遇见import依赖时，会直接发起http请求对应的模块文件。

开发环境

本文使用的版本为vite@0.3.2，附github项目地址~目前这个项目貌似每天都在更新

首先克隆仓库

git clone https://github.com/vuejs/vitecd vite && yarn

环境安装完毕后在项目下创建examples目录，新增index.html和Comp.vue文件，这里直接用README.md中的例子

首先是inidex.html

				
	
	

		
相关文章