hll-vite

1. vite - 基于原生的esmodule实现 开发 - 生成还是使用的rollup

Usage no npm install needed!

<script type="module">
  import hllVite from 'https://cdn.skypack.dev/hll-vite';
</script>

README

  1. vite
  • 基于原生的esmodule实现 开发
  • 生成还是使用的rollup
  1. 实现原理
  • 在浏览器端使用export import的方式导出和导入模块 同时实现了按需加载
  • 在koa中间件获取请求body
  • 通过es-module-lexer解析资源ast拿到import的内容
  • 判断import的资源是否是npm模块
  • 返回处理后的资源路径 vue ==> "/@modules/vue"
  • 将处理的template script style需要的依赖以http请求的方式 通过query参数区分加载sfc文件各个模块内容
  1. 实现
  • koa、koa-static vite内部使用koa进行编写
  • es-module-lexer 分析es6 import语法
  • magic-string 实现重写字符串内容