What's new​

• All In ES Module
• Tailwindcss 4
• Pnpm 10
• vite 7
• ESLint flat config
• Update all dependencies
• Refactor Stylelint rules, add esboot-stylelint-config.
• Enhance esboot-browser, support more browser tools
• Add esboot-browser-react, for browser React project support
• Support vue
• Embrace React Compiler.
• Fix bugs
• Based on the development of the past year, optimize the template code
• Optimize Website UI
• Support Template variables

ESBoot​

• Replace biome to eslint(antfu/eslint-config).
• Upgrade node engine to 20.19.0.
• vite@5 => vite@7.
• Upgrade Bridge Mock@2

Bundler​

• px2rem exclude node_modules by default
• Support assetsInlineLimit configuration.

Bundler-webpack​

• feat: extraBabelIncludes support to absPath or npm pkg
• fix: build time is 0
• fix: tailwindcss not work after build by webpack
• chore: support import x from x.scss
• chore: Remove Webpackbar
• chore: Change cjs to esm
• chore: remove postcss-normalize
• chore: remove postcss-flexbugs-fixes

Bundler-vite​

• fix: Handle import * as variableName syntax

• fix: styleName has a whitespace

• fix: Scss file does not provide an export named default

• feat: Warning when not found styleName like webpack.

• feat: support tailwindcss@4

• chore: Upgrade vite-plugin-static-copy@2 to @3

• chore: Upgrade vite@5 to @7

• chore: Upgrade express@4 to @5

Tailwindcss 4.0​

Tailwindcss upgraded to 4.1.

Breaking Changes​

• Config file modified
• Entry file modified

Changes from v3​

See changes from v3

• Remove @apply
• Remove @config
• Remove @variants
• Remove @responsive
• Remove @screen
• Remove @variants

Browser​

• add userAgent, isBrowser, isAndroid, isIos
• add createExternalConsole

Browser-react​

• add React Error boundary

ESLint​

• Refactor config
• Restrict key naming in lang json
• 8 => 9 / flat config

Stylelint​

• Refactor config

Plugin-vue​

• Support vue projects, see Plugin-vue

Template​

• React 18.3 => React 19.2
• @reduxjs/toolkit to Zustand
• Upgrade to bridge@3
• Dynamic import lang
• Improve Code Quality

Website​

• Update UI
• Add Development Docs section, like i18n/css etc.

Config​

• Remove tailwindcssOptions
• Add assetsInlineLimit.
• React Compiler support

React Compiler Experimental Support​

ESBoot v4 added experimental support for React Compiler. React Compiler is an automatic optimization tool from the React team, which can automatically perform memoization and other performance optimizations.

Configuration​

Add to config file:

experimental: {
  reactCompiler: {
    enable: true,
    target: '19', // or '18'
  },
}

Next Step​

Go to Roadmap for more details.

更新了什么​

重构代码​

• 更有扩展性的架构。
• 优化代码。
• 重构plugin机制。
• 添加更多feature。
• 根据v2经验移除部分过时feature。

支持多Bundler​

• webpack的存档。
• vite占有率的提升。
• rust基建的兴起。

更新部分依赖到最新的稳定版本​

一年一更新，锁死版本。

更合理的代码结构​

packages​

.
├── bundler-common
├── bundler-rspack
├── bundler-vite
├── bundler-webpack
├── common
├── esboot
├── esboot-browser
├── eslint-plugin-esboot
├── lint
├── plugin-vitest
└── vscode-extension-esboot

12 directories.

Bundlers​

• bundler-common: Bundler通用工具
• bundler-rspack: Bundler Rspack
• bundler-vite: Bundler Vite
• bundler-webpack: Bundler Webpack

ESBoot​

• common: esboot通用工具
• ESBoot: 入口，注册cli，调用bundler
• esboot-browser: 浏览器端工具

Lint​

• eslint-plugin-esboot: eslint插件
• lint: lint相关

Plugin​

• plugin-vitest: vitest插件

Other Tools​

• vscode-extension-esboot: vscode插件

Bundler​

分析出一套常用的config，自定义配置使用customConfig。

webpack​

100%

• 实现v2的所有功能。
• 重新实现langjsonpick。
• 放弃webpack-chain。

vite​

80%

• 支持SPA
• 支持styleName
• 平滑支持webapck配置。

rspack​

• 开发10%

项目文档​

• 基于v2 doc的使用设计为更简洁的doc设计。
• 更好看的主题。
• 添加changelog支持。

ESBoot Browser​

增加esboot-browser包，封装常用的浏览器端工具。

ESBoot 文档更新​

• 更合理的文档结构。
• 补充更多文档。
• 优先讲述ESBoot的立意。
• 添加最佳实践

依赖更新​

只记录大版本更新。

commander​

• Command 11.0.0 => 12.0.0

https://github.com/tj/commander.js/releases/tag/v12.0.0

webpack-dev-server​

4 => 5

修改了好多api，https，http这种。

babel​

• 移除@babel/plugin-syntax-dynamic-import

This plugin is included in @babel/preset-env, in ES2020。

• 移除babel-plugin-transform-react-remove-prop-types

现在已经不用写prop type

husky​

最新是9，改成了husky init命令，但是发现升级也没有什么用处，就懒得升级了，还是用8.

但是有个新的更新，.husky目录放到了config目录下，根目录又会少一个文件。

command​

prepare​

postinstall + g-alias => prepare

• prepare就是去生成一些lint规则、ts规则这些/husky安装。
• postinstall有些语义不明。
• g-alias是刚开始设计不全，只考虑了生成alias后面发现需要准备的东西越来越多。

exec_git_hooks​

commitlint / lint-staged => exec_git_hooks

Git hooks的两个钩子命令更新。

• 封装的更内敛，更语义化。

preview​

• 使用pnpx启动，代替直接下载包。

Config​

移除环境变量ESBOOT_PROJECT_TYPE，增加isSP配置​

之间用来区分是SP还是MP，现在在.esbootrc中添加isSP配置。

原因：尽量减少环境变量，没有类型声明，可读性也不好。

更新jsminifier/cssminifier​

移除lightningcss/swc(build不需要那么快，反而下包要太久了)，固定用TerserPlugin和nano。(放弃webpack里使用rust，直接寻求vite或者rspack)。

• 去掉了rust包因为发现对打包的时间其实并不敏感，反而对下包的时间敏感，而且配置使用的不多。

移除ForkTsCheckerWebpackPlugin​

• ForkTsCheckerWebpackPlugin因为激进的策略，所以几乎不会使用，所以实现后暂时移除。

customWebpack => customConfig​

现在有多个bundler，customConfig这个配置更抽象一些。

增加 minimize​

用来控制是否压缩代码。

增加 server 配置​

将server的配置独立出来，结构更清晰，包含host、https、open、port、proxy。

server?: {
  host?: string;
  https?: boolean;
  open?: boolean;
  port?: number;
  proxy?: Proxy[];
};

配置文件​

stylintconfig​

• stylintconfig 地址修改，版本锁死

插件​

重构插件机制​

240927

更合理的架构设计，更具扩展性的API。

内置支持tailwindcss​

240810

tailwindcss刚开始抽成插件是因为只是一个实验性的功能，经过多个项目的实验发现很好用，所以v3版本内置支持。

工具​

添加vscode-extension-esboot​

初步支持GUI操作环境变量，后续会添加更多功能(看情况)。

因为环境变量没有类型提示，但是某些情况很需要。但是现有的环境变量我都记不住，反正我记不住，特别是只想启动某些页面的时候。

ESLint规则更新​

增加规则，禁止引用非自己平台的代码​

已经提前在esboot v2上实现了。

移除Hooks使用​

之前使用的afterHooks是一个没有经过深思熟虑的设计，在v3中移除。完全使用plugin机制替代。例如v2经常使用的

export const afterHooks = (cfg) => {
  console.log(Object.entries(cfg._entry), '<-- cfg');
};

在v3中，可以完全使用plugin机制替代。

For the migration guide, refer to the existing v3 docs here:

Migrate to ESBoot 3

import { defineConfig, type Configuration, PluginHooks } from '@dz-web/esboot';

export default defineConfig({
  plugins: [
    {
      key: 'plugin-log',
      [PluginHooks.afterCompile]: (cfg) => {
        console.log(cfg.entry);
      },
    },
  ],
});

其他功能​

• build优化，CI环境禁止使用缓存、也不使用webpackbar。

待完成功能​

• ⭐️ 支持RSPack
• ⭐️ 支持changelogs
• ⭐️ 优化项目文档

Feature​

• 支持mock
• 支持多端同时开发
• 扩展tailwind内置 cva和cn
• svgo配置

Plugins​

Vitest​

• 测试覆盖率
• 多平台同步测试

Bugs​

• bug: tree-shaking失败
• bug: 物理缓存
• bug: mfsu-引入第三方css问题(antd-mobile的日期选择组件)

Migrate from v2 to v3​

Refer to the existing v3 migration guide here: Migrate to ESBoot 3