chore: drop @babel/plugin-proposal-class-properties

examples/swiper-effect/package.json

@@ -57,7 +57,7 @@
   },
   "devDependencies": {
     "@babel/core": "^7.24.4",
-    "@babel/plugin-proposal-class-properties": "7.14.5",
+    "@babel/plugin-transform-class-properties": "7.25.9",
     "@babel/preset-react": "^7.24.1",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.5",
     "@tarojs/cli": "4.0.7",

package.json

@@ -55,7 +55,7 @@
     "@babel/core",
     "@babel/helper-plugin-utils",
     "@babel/parser",
-    "@babel/plugin-proposal-class-properties",
+    "@babel/plugin-transform-class-properties",
     "@babel/plugin-proposal-decorators",
     "@babel/plugin-proposal-do-expressions",
     "@babel/plugin-proposal-object-rest-spread",

packages/babel-plugin-transform-taroapi/__tests__/index.spec.ts

@@ -1,31 +1,37 @@
 import * as babel from '@babel/core'
 import * as t from '@babel/types'
 
-import * as definition from '../../taro-platform-h5/dist/definition.json'
+import * as definition from '../../taro-platform-h5/definition/definition.json'
 import plugin from '../src'
 
-type ImportType = babel.types.ImportSpecifier | babel.types.ImportDefaultSpecifier | babel.types.ImportNamespaceSpecifier
+type ImportType =
+  | babel.types.ImportSpecifier
+  | babel.types.ImportDefaultSpecifier
+  | babel.types.ImportNamespaceSpecifier;
 
 const packageName = '@tarojs/taro-h5'
 const pluginOptions = [
   plugin,
   {
     packageName,
     definition,
-  }
+  },
 ]
-const getNamedImports = (importSpecifiers: (t.ImportSpecifier | t.ImportDefaultSpecifier | t.ImportNamespaceSpecifier)[]) => {
+const getNamedImports = (
+  importSpecifiers: (t.ImportSpecifier | t.ImportDefaultSpecifier | t.ImportNamespaceSpecifier)[],
+) => {
   return importSpecifiers.reduce((prev, curr) => {
     if (t.isImportSpecifier(curr)) {
       prev.add(((curr as t.ImportSpecifier).imported as babel.types.Identifier).name)
     }
     return prev
   }, new Set())
 }
-const babelTransform = (code = '') => babel.transform(code, { ast: true, configFile: false, plugins: [pluginOptions] })
+const babelTransform = (code = '') =>
+  babel.transform(code, { ast: true, configFile: false, plugins: [pluginOptions] })
 
 describe('babel-plugin-transform-taroapi', () => {
-  test('should work!', function () {
+  test('should work!', () => {
     const code = `
       import Taro, { setStorage, initPxTransform, param } from '${packageName}';
       initPxTransform(param)
@@ -39,7 +45,7 @@ describe('babel-plugin-transform-taroapi', () => {
     expect(result?.code).toMatchSnapshot()
   })
 
-  test('should leave other apis untouched', function () {
+  test('should leave other apis untouched', () => {
     const code = `
       import Taro from '${packageName}'
       Taro.noop
@@ -51,24 +57,23 @@ describe('babel-plugin-transform-taroapi', () => {
     const body = ast.program.body as [t.ImportDeclaration, t.ExpressionStatement]
     expect(t.isImportDeclaration(body[0])).toBeTruthy()
     expect(t.isExpressionStatement(body[1])).toBeTruthy()
-    const defaultImport = body[0].specifiers.find(v => t.isImportDefaultSpecifier(v)) as ImportType
+    const defaultImport = body[0].specifiers.find((v) =>
+      t.isImportDefaultSpecifier(v),
+    ) as ImportType
     expect(defaultImport).toBeTruthy()
 
     const taroName = defaultImport.local.name
     const namedImports = getNamedImports(body[0].specifiers)
     expect(namedImports).toEqual(new Set())
     expect(t.isMemberExpression(body[1].expression)).toBeTruthy()
 
-    const obj = t.memberExpression(
-      t.identifier(taroName),
-      t.identifier('noop'),
-    )
+    const obj = t.memberExpression(t.identifier(taroName), t.identifier('noop'))
     delete obj.optional
 
-    expect((body[1].expression as t.MemberExpression)).toMatchObject(obj)
+    expect(body[1].expression as t.MemberExpression).toMatchObject(obj)
   })
 
-  test('should move static apis under "Taro"', function () {
+  test('should move static apis under "Taro"', () => {
     const code = `
       import { noop } from '${packageName}';
       noop;
@@ -82,21 +87,20 @@ describe('babel-plugin-transform-taroapi', () => {
     const body = ast.program.body as [t.ImportDeclaration, t.ExpressionStatement]
     expect(t.isImportDeclaration(body[0])).toBeTruthy()
     expect(t.isExpressionStatement(body[1])).toBeTruthy()
-    const defaultImport = body[0].specifiers.find(v => t.isImportDefaultSpecifier(v))
+    const defaultImport = body[0].specifiers.find((v) => t.isImportDefaultSpecifier(v))
     expect(defaultImport).toBeTruthy()
 
     const taroName = defaultImport!.local.name
     let memberExpression: any = body[1].expression
     if (t.isCallExpression(body[1])) {
       memberExpression = ((body[1] as t.ExpressionStatement).expression as t.CallExpression).callee
     }
-    expect(memberExpression).toMatchObject(t.memberExpression(
-      t.identifier(taroName),
-      t.identifier('noop')
-    ))
+    expect(memberExpression).toMatchObject(
+      t.memberExpression(t.identifier(taroName), t.identifier('noop')),
+    )
   })
 
-  test('should not import taro duplicity', function () {
+  test('should not import taro duplicity', () => {
     const code = `
       import { Component } from '${packageName}';
       import Taro from '${packageName}';
@@ -108,13 +112,17 @@ describe('babel-plugin-transform-taroapi', () => {
     const result = babelTransform(code)
     expect(result?.code).toMatchSnapshot()
     const ast = result?.ast as t.File
-    const body = ast.program.body as [t.ImportDeclaration, t.ExpressionStatement, t.ExpressionStatement]
+    const body = ast.program.body as [
+      t.ImportDeclaration,
+      t.ExpressionStatement,
+      t.ExpressionStatement,
+    ]
     expect(t.isImportDeclaration(body[0])).toBeTruthy()
     expect(t.isExpressionStatement(body[1])).toBeTruthy()
     expect(t.isExpressionStatement(body[2])).toBeTruthy()
   })
 
-  test('should not go wrong when using an api twice', function () {
+  test('should not go wrong when using an api twice', () => {
     const code = `
       import Taro from '${packageName}';
       const animation = Taro.createAnimation({
@@ -132,7 +140,7 @@ describe('babel-plugin-transform-taroapi', () => {
     }).not.toThrowError()
   })
 
-  test('should preserve default imports', function () {
+  test('should preserve default imports', () => {
     const code = `
       import Taro from '${packageName}'
       console.log(Taro)
@@ -141,7 +149,7 @@ describe('babel-plugin-transform-taroapi', () => {
     expect(result?.code).toMatchSnapshot()
   })
 
-  test('should preserve assignments in left hands', function () {
+  test('should preserve assignments in left hands', () => {
     const code = `
       import Taro from '${packageName}'
       let animation
@@ -159,7 +167,7 @@ describe('babel-plugin-transform-taroapi', () => {
     expect(result?.code).toMatchSnapshot()
   })
 
-  test('should support rename of imported names', function () {
+  test('should support rename of imported names', () => {
     const code = `
     // import { inject as mobxInject, observer as mobxObserver } from '@tarojs/mobx'
     import { Component as TaroComponent } from '${packageName}';
@@ -169,7 +177,7 @@ describe('babel-plugin-transform-taroapi', () => {
     expect(result?.code).toMatchSnapshot()
   })
 
-  test('should canIUse work or skip!', function () {
+  test('should canIUse work or skip!', () => {
     const code = `
     import Taro from '${packageName}'
     function canIUse() {}
@@ -181,7 +189,7 @@ describe('babel-plugin-transform-taroapi', () => {
     expect(result?.code).toMatchSnapshot()
   })
 
-  test('should canIUse support!', function () {
+  test('should canIUse support!', () => {
     const code = `
     import { canIUse as canUse } from '${packageName}';
     // 对象的属性或方法

packages/babel-preset-taro/README.md

@@ -30,7 +30,7 @@ module.exports = {
 
 - `@babel/plugin-transform-runtime`
 - `@babel/plugin-proposal-decorators`
-- `@babel/plugin-proposal-class-properties`
+- `@babel/plugin-transform-class-properties`
 - `babel-plugin-dynamic-import-node`（小程序环境）
 
 #### 2. React
@@ -150,7 +150,7 @@ import "core-js/modules/es.string.pad-end";
 
 **默认值**：`false`
 
-同时是 `@babel/preset-env`、`@babel/plugin-proposal-class-properties` 的 `loose` 配置项。
+同时是 `@babel/preset-env`、`@babel/plugin-transform-class-properties` 的 `loose` 配置项。
 
 ### debug
 
@@ -167,23 +167,23 @@ import "core-js/modules/es.string.pad-end";
 ### spec
 
 `@babel/preset-env` 的 [spec](https://babeljs.io/docs/en/babel-preset-env#spec) 配置项。
-  
+
 ### configPath
 
 `@babel/preset-env` 的 [configPath](https://babeljs.io/docs/en/babel-preset-env#configpath) 配置项。
-  
+
 ### include
 
 `@babel/preset-env` 的 [include](https://babeljs.io/docs/en/babel-preset-env#include) 配置项。
-  
+
 ### exclude
 
 `@babel/preset-env` 的 [exclude](https://babeljs.io/docs/en/babel-preset-env#exclude) 配置项。
-  
+
 ### shippedProposals
 
 `@babel/preset-env` 的 [shippedProposals](https://babeljs.io/docs/en/babel-preset-env#shippedproposals) 配置项。
-  
+
 ### forceAllTransforms
 
 `@babel/preset-env` 的 [forceAllTransforms](https://babeljs.io/docs/en/babel-preset-env#forcealltransforms) 配置项。
@@ -203,14 +203,14 @@ import "core-js/modules/es.string.pad-end";
 
 **默认值**：开发者根目录 `node_modules` 中的 `@babel/plugin-transform-runtime` 的路径。
 
-**类型**：`string` 
+**类型**：`string`
 
 `@babel/plugin-transform-runtime` 的 [absoluteRuntime](https://babeljs.io/docs/en/babel-plugin-transform-runtime#absoluteruntime) 配置项。
 
 ### version
 
 **默认值**：开发者根目录 `node_modules` 中的 `@babel/plugin-transform-runtime` 的版本号。
 
-**类型**：`string` 
+**类型**：`string`
 
 `@babel/plugin-transform-runtime` 的 [version](https://babeljs.io/docs/en/babel-plugin-transform-runtime#version) 配置项。

packages/babel-preset-taro/index.js

@@ -1,4 +1,4 @@
-const path = require('path')
+const path = require('node:path')
 
 function hasBrowserslist() {
   const fs = require('@tarojs/helper').fs
@@ -30,7 +30,7 @@ module.exports = (_, options = {}) => {
   const overrides = []
   const isVite = options.compiler === 'vite'
   // vite 不需要 react 的 preset，在内部已经处理了
-  const isReact = options.framework === 'react' || options.framework === 'preact' && !isVite
+  const isReact = options.framework === 'react' || (options.framework === 'preact' && !isVite)
   // vite 不需要 solid 的 preset，在内部已经处理了
   const isSolid = options.framework === 'solid' && !isVite
   // vite 不需要 vue 的 preset，在内部已经处理了
@@ -50,7 +50,11 @@ module.exports = (_, options = {}) => {
         ...presetReactConfig,
       },
     ])
-    if (process.env.TARO_PLATFORM === 'web' && process.env.NODE_ENV !== 'production' && options.hot !== false) {
+    if (
+      process.env.TARO_PLATFORM === 'web' &&
+      process.env.NODE_ENV !== 'production' &&
+      options.hot !== false
+    ) {
       if (options.framework === 'react') {
         plugins.push([require('react-refresh/babel'), { skipEnvCheck: true }])
       } else if (options.framework === 'preact') {
@@ -69,10 +73,7 @@ module.exports = (_, options = {}) => {
         uniqueTransform: true,
       })
     }
-    presets.push([
-      require('babel-plugin-transform-solid-jsx'),
-      solidOptions,
-    ])
+    presets.push([require('babel-plugin-transform-solid-jsx'), solidOptions])
   }
 
   if (isVue3) {
@@ -159,9 +160,9 @@ module.exports = (_, options = {}) => {
     forceAllTransforms,
   }
 
-  let transformRuntimeCorejs = false
+  let transformRuntimeCoreJs = false
   if (useBuiltIns === 'usage') {
-    transformRuntimeCorejs = 3
+    transformRuntimeCoreJs = 3
   } else {
     envOptions.useBuiltIns = useBuiltIns
     if (useBuiltIns === 'entry') {
@@ -183,14 +184,14 @@ module.exports = (_, options = {}) => {
         legacy: decoratorsLegacy !== false,
       },
     ],
-    [require('@babel/plugin-proposal-class-properties'), { loose }]
+    [require('@babel/plugin-transform-class-properties'), { loose }],
   )
 
   plugins.push([
     require('@babel/plugin-transform-runtime'),
     {
       regenerator: true,
-      corejs: transformRuntimeCorejs,
+      corejs: transformRuntimeCoreJs,
       helpers: true,
       useESModules: process.env.NODE_ENV !== 'test',
       absoluteRuntime,

packages/taro-cli/templates/default/package.json.tmpl

@@ -76,7 +76,7 @@
   "devDependencies": {
     "@babel/core": "^7.24.4",
     "@tarojs/cli": "{{ version }}",
-    "@babel/plugin-proposal-class-properties": "7.14.5",
+    "@babel/plugin-transform-class-properties": "7.25.9",
     "@types/webpack-env": "^1.13.6",{{#if (includes "React" "Preact" s=framework)}}
     "@types/react": "^18.0.0",{{/if}}{{#if (eq compiler "Webpack5") }}
     "webpack": "5.91.0",
@@ -111,7 +111,7 @@
   }{{/if}}{{#if (eq compiler "Vite") }}
   "devDependencies": {
     "@babel/core": "^7.24.4",
-    "@babel/plugin-proposal-class-properties": "7.14.5",
+    "@babel/plugin-transform-class-properties": "7.25.9",
     "@tarojs/cli": "{{ version }}",
     "@tarojs/vite-runner": "{{ version }}",
     "babel-preset-taro": "{{ version }}",
@@ -140,4 +140,3 @@
     "postcss": "^8.4.38"
   }{{/if}}
 }
-

packages/taro-components/babel.config.json

@@ -1,11 +1,5 @@
 {
-  "presets": [
-    "@babel/preset-react",
-    "power-assert"
-  ],
-  "plugins": [
-    "@babel/plugin-proposal-class-properties",
-    "@babel/plugin-proposal-object-rest-spread"
-  ],
+  "presets": ["@babel/preset-react", "power-assert"],
+  "plugins": ["@babel/plugin-transform-class-properties", "@babel/plugin-proposal-object-rest-spread"],
   "babelrcRoots": ["./h5/*"]
 }