fix(swc): transform core-js-pure incorrectly, allow using new decorat…

…or for js (#4680)

.changeset/shiny-deers-live.md

@@ -0,0 +1,7 @@
+---
+'@modern-js/libuild-plugin-swc': patch
+'@modern-js/builder-plugin-swc': patch
+---
+
+fix(swc): fix transform core-js-pure incorrectly, allow using new decorator for js
+fix(swc): 修复误转换core-js-pure，对js允许使用新 decorator

packages/builder/plugin-swc/package.json

@@ -64,7 +64,7 @@
     "@babel/preset-react": "^7.22.15",
     "@babel/preset-typescript": "^7.22.15",
     "@modern-js/builder-shared": "workspace:*",
-    "@modern-js/swc-plugins": "0.6.0",
+    "@modern-js/swc-plugins": "0.6.3",
     "@modern-js/utils": "workspace:*",
     "@swc/helpers": "0.5.1",
     "core-js": "~3.32.1"

packages/builder/plugin-swc/tests/fixtures/extensions/lock-corejs-versions/actual.js

@@ -0,0 +1,7 @@
+/** should be transformed */
+import 'core-js/foo/bar'
+import '@swc/helpers/foo/bar'
+
+/** should stay as is */
+import 'core-js-pure/foo/bar'
+import '@swc/helpers-custom/foo/bar'

packages/builder/plugin-swc/tests/fixtures/extensions/lock-corejs-versions/expected.js

@@ -0,0 +1,4 @@
+/** should be transformed */ import "/path/to/corejs/foo/bar";
+import "/path/to/helper/foo/bar";
+/** should stay as is */ import "<CORE_JS>-pure/foo/bar";
+import "<SWC_HELPER>-custom/foo/bar";

packages/builder/plugin-swc/tests/fixtures/extensions/lock-corejs-versions/option.json

@@ -0,0 +1,8 @@
+{
+  "extensions": {
+    "lockCorejsVersion": {
+      "corejs": "/path/to/corejs",
+      "swcHelpers": "/path/to/helper"
+    }
+  }
+}

packages/libuild/libuild-plugin-swc/package.json

@@ -21,7 +21,7 @@
     "@modern-js/libuild-utils": "workspace:*"
   },
   "dependencies": {
-    "@modern-js/swc-plugins": "0.6.0",
+    "@modern-js/swc-plugins": "0.6.3",
     "chalk": "4.1.0"
   },
   "files": [

tests/integration/swc/fixtures/decorator/legacy/modern.config.ts

@@ -0,0 +1,19 @@
+import appTools, { defineConfig } from '@modern-js/app-tools';
+import { swcPlugin } from '@modern-js/plugin-swc';
+
+export default defineConfig({
+  tools: {
+    swc: {
+      jsc: {
+        transform: {
+          /** ts cant use new decorator */
+          legacyDecorator: false,
+        },
+      },
+    },
+  },
+  output: {
+    disableMinimize: true,
+  },
+  plugins: [appTools(), swcPlugin()],
+});

tests/integration/swc/fixtures/decorator/legacy/package.json

@@ -0,0 +1,10 @@
+{
+  "private": true,
+  "name": "swc-test-decorator-legacy",
+  "version": "2.9.0",
+  "dependencies": {},
+  "devDependencies": {
+    "@modern-js/app-tools": "workspace:*",
+    "@modern-js/plugin-swc": "workspace:*"
+  }
+}

tests/integration/swc/fixtures/decorator/legacy/src/index.ts

@@ -0,0 +1,12 @@
+function newDecorator() {
+  console.log('foo decorator');
+}
+
+class Foo {
+  @newDecorator()
+  foo() {
+    console.log('foo');
+  }
+}
+
+console.log(new Foo());

tests/integration/swc/fixtures/decorator/new/modern.config.ts

@@ -0,0 +1,19 @@
+import appTools, { defineConfig } from '@modern-js/app-tools';
+import { swcPlugin } from '@modern-js/plugin-swc';
+
+export default defineConfig({
+  tools: {
+    swc: {
+      jsc: {
+        transform: {
+          /** use new decorator */
+          legacyDecorator: false,
+        },
+      },
+    },
+  },
+  output: {
+    disableMinimize: true,
+  },
+  plugins: [appTools(), swcPlugin()],
+});

tests/integration/swc/fixtures/decorator/new/package.json

@@ -0,0 +1,10 @@
+{
+  "private": true,
+  "name": "swc-test-decorator",
+  "version": "2.9.0",
+  "dependencies": {},
+  "devDependencies": {
+    "@modern-js/app-tools": "workspace:*",
+    "@modern-js/plugin-swc": "workspace:*"
+  }
+}

tests/integration/swc/fixtures/decorator/new/src/index.js

@@ -0,0 +1,12 @@
+function newDecorator() {
+  console.log('foo decorator');
+}
+
+class Foo {
+  @newDecorator()
+  foo() {
+    console.log('foo');
+  }
+}
+
+console.log(new Foo());

tests/integration/swc/tests/decorator.test.ts

@@ -0,0 +1,36 @@
+import path from 'path';
+import { readFileSync, readdirSync } from 'fs';
+import { modernBuild } from '../../../utils/modernTestUtils';
+
+const fixtures = path.resolve(__dirname, '../fixtures');
+
+const getJsFiles = (appDir: string) =>
+  readdirSync(path.resolve(appDir, 'dist/static/js'))
+    .filter(filepath => /\.js$/.test(filepath))
+    .map(filePath =>
+      readFileSync(path.join(appDir, 'dist/static/js', filePath)),
+    );
+
+describe('swc use new decorator', () => {
+  test('should use new decorator', async () => {
+    const appDir = path.resolve(fixtures, 'decorator/new');
+
+    await modernBuild(appDir);
+
+    const jsFiles = getJsFiles(appDir);
+    expect(
+      jsFiles.some(item => item.includes('@swc/helpers/esm/_decorate.js')),
+    ).toBeTruthy();
+  });
+
+  test('should use legacy decorator', async () => {
+    const appDir = path.resolve(fixtures, 'decorator/legacy');
+
+    await modernBuild(appDir);
+
+    const jsFiles = getJsFiles(appDir);
+    expect(
+      jsFiles.every(item => !item.includes('@swc/helpers/esm/_decorate.js')),
+    ).toBeTruthy();
+  });
+});