前言:卖报卖报,热腾腾新鲜出炉的~👻,据悉,11月16日,Vite发布了
5.0
版本,并且使用了rollup 4 ,npm 下载量也日益翻倍增长,一直以来,webpack位列老大之位,经过千锤百炼的版本迭代,拥有(后宫佳丽三千🤔,呸,跑题了)丰富的plugin,应对不同的场景基本都有相应的解决方案,为什么大家还会去选择Vite呢?
更新了哪些呢
- Vite
Node.js 支持
💫Vite 不再支持 Node.js 14 / 16 / 17 / 19,因为它们已经到了 EOL。现在需要 Node.js 18 / 20+。
Rollup 4
💫 导入断言(assertions 属性)已被重命名为导入属性(attributes 属性)。
💫 不再支持 Acorn 插件。
💫 对于 Vite 插件,this.resolve 的 skipSelf 选项现在默认为 true。
💫 对于 Vite 插件,this.parse 现在只支持 allowReturnOutsideFunction 选项。
💦 如果你正在使用 TypeScript,请确保将 moduleResolution: 'bundler'(或 node16/nodenext)设置为 Rollup 4 需要它。或者你可以设置 skipLibCheck: true。
-
废弃 CJS Node API
💦 CJS 的 Node API 已经被废弃。当调用 require('vite') 时,将会记录一个废弃警告。你应该更新你的文件或框架来导入 Vite 的 ESM 构建。
- 在一个基础的 Vite 项目中,请确保:
💫 vite.config.js 配置文件的内容使用 ESM 语法。
💫 最近的 package.json 文件中有 "type": "module",或者使用 .mjs/.mts 扩展名,例如 vite.config.mjs 或者 .vite.config.mts。
- 对于其他项目,有几种常见的方法:
💫 配置 ESM 为默认,如果需要则选择 CJS: 在项目 package.json 中添加 "type": "module"。所有 *.js 文件现在都被解释为 ESM,并且需要使用 ESM 语法。你可以将一个文件重命名为 .cjs 扩展名来继续使用 CJS。
💫 保持 CJS 为默认,如果需要则选择 ESM: 如果项目 package.json 没有 "type": "module",所有 *.js 文件都被解释为 CJS。你可以将一个文件重命名为 .mjs 扩展名来使用 ESM。
💫 动态导入 Vite: 如果你需要继续使用 CJS,你可以使用 import('vite') 动态导入 Vite。这要求你的代码必须在一个 async 上下文中编写,但是由于 Vite 的 API 大多是异步的,所以应该还是可以管理的。
- 在一个基础的 Vite 项目中,请确保:
未完待续...