前往小程序,Get更优阅读体验!
立即前往
发布
社区首页 >专栏 >Vite4新特性介绍,相较于Vite3有哪些新功能?

Vite4新特性介绍,相较于Vite3有哪些新功能?

作者头像
房东的狗丶
发布2023-02-17 15:08:00
发布2023-02-17 15:08:00
3.1K00
代码可运行
举报
文章被收录于专栏:友人a的笔记丶友人a的笔记丶
运行总次数:0
代码可运行

官方介绍更新日志:https://vitejs.dev/blog/announcing-vite3.html#dev-improvements

Vite3更新日志

Vite 不再支持 Node v12,因为它已经进入了 EOL 阶段。现在你必须使用 Node 14.18+ 及以上版本。

迁移指南:https://cn.vitejs.dev/guide/migration.html#general-changes

1.Terser

现在是一个可选依赖。如果你使用的是 build.minify: 'terser',需要手动安装.

代码语言:javascript
代码运行次数:0
复制
npm i -D terser

2.import.meta

import.meta.glob 的 key 现在是相对于当前模块。

代码语言:javascript
代码运行次数:0
复制
// 文件:/foo/index.js
const modules = import.meta.glob('../foo/*.js')

// 转换为:
const modules = {
-  '../foo/bar.js': () => {}
+  './bar.js': () => {}
}

提示

经过实际测试,返回的结构还是之前的2.x版本的结构

多个模式可以作为数组传递

代码语言:javascript
代码运行次数:0
复制
import.meta.glob(['./dir/*.js', './another/*.js'])

现在支持否定模式!(以 为前缀)忽略某些特定文件

代码语言:javascript
代码运行次数:0
复制
import.meta.glob(['./dir/*.js', '!**/bar.js'])

可以指定命名导入以改进 tree-shaking

代码语言:javascript
代码运行次数:0
复制
import.meta.glob('./dir/*.js', { import: 'setup' })

可以传递自定义查询以附加元数据

代码语言:javascript
代码运行次数:0
复制
import.meta.glob('./dir/*.js', { query: { custom: 'data' } })

import.meta.globEager 已经弃用,使用 import.meta.glob('*', { eager: true }) 来代替。

代码语言:javascript
代码运行次数:0
复制
import.meta.glob('./dir/*.js', { eager: true }) 

3.自动生成 https 证书

当使用 https 时需要一个合法可用的证书。在 Vite v2 中,如果没有配置证书,Vite 会自动生成和缓存一个自签名的证书。 从 Vite v3 开始,我们推荐手动创建你自己的证书。如果你仍想要使用 v2 中的自动生成,该功能可以通过添加 @vitejs/plugin-basic-ssl 到项目插件中来实现。

代码语言:javascript
代码运行次数:0
复制
import basicSsl from '@vitejs/plugin-basic-ssl'

export default {
  plugins: [basicSsl()]
}

提示

这个证书同样还是不受信任的证书,初次访问还是得点信任。

Vite4更新日志

官方文档:https://vitejs.dev/blog/announcing-vite4.html

安装后,同步升级@vitejs/plugin-vue、@vitejs/plugin-react到4.0版本即可。

安装Vite

要求 { node: '^14.18.0 || >=16.0.0' },直接指定版本升级好多依赖项报错,推荐重新安装重新配置。

代码语言:javascript
代码运行次数:0
复制
npm create vite@latest
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022-07-23,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • Vite3更新日志
    • 1.Terser
    • 2.import.meta
    • 3.自动生成 https 证书
  • Vite4更新日志
  • 安装Vite
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档