Parcel v2.4.0

1 月,我们宣布了 Parcel CSS,一个用 Rust 编写的超快速的新 CSS 解析器、编译器和压缩器。从那时起,我们一直在努力改进它,并添加了 许多新功能,并进一步提升了性能。今天,我们很高兴地宣布 Parcel CSS 现在是 Parcel v2.4.0 中的默认 CSS 转换器和压缩器!

新功能

#

以下是自我们首次宣布以来添加到 Parcel CSS 的一些主要功能的摘要。

借助这些功能,Parcel CSS 现在可以作为许多常见基于 PostCSS 的设置的替代方案,包括 autoprefixer、postcss-preset-env、postcss-modules 和 cssnano。

升级

#

在 Parcel v2.4.0 中,默认的 CSS 转换器和压缩器已更新为使用 Parcel CSS。在大多数项目中,这应该是无缝的。但是,有一些需要注意的地方。

PostCSS 仍然完全受支持,因此您当前的配置仍然可以正常工作。但是,我们在 Parcel 中添加了警告,以便在建议您更新项目的配置以提高构建性能时通知您。

cssnano 配置

#

如果您在项目中有一个 cssnano 配置文件,例如 .cssnanorc,它将不再默认使用。在构建项目时,您可能会在控制台中看到有关此问题的警告。如果您不再需要此配置文件,可以将其删除,或者设置 .parcelrc 以继续使用 cssnano。有关更多详细信息,请参阅 文档

autoprefixer 和 postcss-preset-env

#

在大多数情况下,Parcel 现在将自动处理供应商前缀和为您的浏览器目标转译 CSS,就像它对 JavaScript 所做的那样。您只需在 package.json 中设置 browserslist 字段,Parcel 就会处理剩下的工作。

Parcel 还提供对编译草案语法的可选支持,例如 嵌套自定义媒体查询伪类填充。有关 Parcel 所有 CSS 转译功能的更多信息,请参阅 新文档

如果您之前使用 autoprefixer 和 postcss-preset-env 来实现这一点,您可能能够从 PostCSS 配置中删除它们以提高构建性能。如果这些是您唯一使用的 PostCSS 插件,您可以完全删除 PostCSS 配置。查看 文档 以了解更多详细信息。

CSS 模块

#

当使用 .module.css 后缀命名时,CSS 模块由 Parcel 自动处理。以前,这是在幕后由 postcss-modules 提供支持的,但现在由 Parcel CSS 处理。

您还可以启用将所有 CSS 文件处理为 CSS 模块。以前,这是通过 PostCSS 配置文件中的顶级 modules 选项完成的。此选项已移至 @parcel/transformer-csspackage.json 中的配置键。有关更多信息,请参阅 文档

严格解析

#

Parcel CSS 解析器比 PostCSS 更严格。当选择器、规则或声明无效时,它会报错。这很有用,因为它可以避免意外地发布在浏览器中加载时被忽略的代码。

在依赖项方面,Parcel CSS 也更符合规范。如果您在 CSS 自定义属性中具有 url() 依赖项,如果您通过相对路径引用文件,您可能会看到一个新的错误。这是模棱两可的,因为 CSS 规范实际上是根据使用 var() 的位置来解析这些依赖项,而不是根据自定义属性定义的位置。Parcel 现在要求自定义属性中的 url 使用绝对路径定义。有关详细信息,请参阅 文档

其他更改

#

Parcel v2.4.0 还带来了其他一些错误修复和改进,包括升级到 SWC 以改进 JavaScript 死代码消除,以及对类静态初始化块的支持。查看 变更日志 以查看所有改进的完整列表。