chore: moving jest to swc

Signed-off-by: blam <ben@blam.sh>

packages/cli/config/jest.js

@@ -131,11 +131,12 @@ async function getProjectConfig(targetPath, displayName) {
 
     transform: {
       '\\.(js|jsx|ts|tsx|mjs|cjs)$': [
-        require.resolve('./jestSucraseTransform.js'),
+        '@swc/jest',
         {
           enableSourceMaps: envOptions.enableSourceMaps || envOptions.nextTests,
         },
       ],
+      // '^.+\\.(t|j)sx?$': '@swc/jest',
       '\\.(bmp|gif|jpg|jpeg|png|frag|xml|svg|eot|woff|woff2|ttf)$':
         require.resolve('./jestFileTransform.js'),
       '\\.(yaml)$': require.resolve('jest-transform-yaml'),

packages/cli/package.json

@@ -52,6 +52,7 @@
     "@sucrase/jest-plugin": "^2.1.1",
     "@sucrase/webpack-loader": "^2.0.0",
     "@swc/core": "^1.2.160",
+    "@swc/jest": "^0.2.20",
     "@svgr/plugin-jsx": "6.3.x",
     "@svgr/plugin-svgo": "6.3.x",
     "@svgr/rollup": "6.3.x",
@@ -116,7 +117,6 @@
     "run-script-webpack-plugin": "^0.1.0",
     "semver": "^7.3.2",
     "style-loader": "^3.3.1",
-    "sucrase": "^3.20.2",
     "swc-loader": "^0.1.15",
     "tar": "^6.1.2",
     "terser-webpack-plugin": "^5.1.3",

packages/cli/src/lib/bundler/config.ts

@@ -150,6 +150,18 @@ export async function createConfig(
     console.warn(`WARNING: Failed to read react-dom version, ${error}`);
   }
 
+  const resolvePlugins: webpack.ResolvePluginInstance[] = [
+    new LinkedPackageResolvePlugin(paths.rootNodeModules, externalPkgs),
+  ];
+
+  if (!isDev) {
+    resolvePlugins.push(
+      new ModuleScopePlugin(
+        [paths.targetSrc, paths.targetDev],
+        [paths.targetPackageJson],
+      ),
+    );
+  }
   return {
     mode: isDev ? 'development' : 'production',
     profile: false,
@@ -181,14 +193,7 @@ export async function createConfig(
         http: false,
         util: require.resolve('util/'),
       },
-      plugins: [
-        new LinkedPackageResolvePlugin(paths.rootNodeModules, externalPkgs),
-        !isDev &&
-          new ModuleScopePlugin(
-            [paths.targetSrc, paths.targetDev],
-            [paths.targetPackageJson],
-          ),
-      ].filter(Boolean),
+      plugins: resolvePlugins,
       alias: resolveAliases,
     },
     module: {
@@ -237,6 +242,19 @@ export async function createBackendConfig(
     runScriptNodeArgs.push('--inspect-brk');
   }
 
+  const resolvePlugins: webpack.ResolvePluginInstance[] = [
+    new LinkedPackageResolvePlugin(paths.rootNodeModules, externalPkgs),
+  ];
+
+  if (!isDev) {
+    resolvePlugins.push(
+      new ModuleScopePlugin(
+        [paths.targetSrc, paths.targetDev],
+        [paths.targetPackageJson],
+      ),
+    );
+  }
+
   return {
     mode: isDev ? 'development' : 'production',
     profile: false,
@@ -276,14 +294,7 @@ export async function createBackendConfig(
       extensions: ['.ts', '.tsx', '.mjs', '.js', '.jsx', '.json'],
       mainFields: ['main'],
       modules: [paths.rootNodeModules, ...moduleDirs],
-      plugins: [
-        new LinkedPackageResolvePlugin(paths.rootNodeModules, externalPkgs),
-        !isDev &&
-          new ModuleScopePlugin(
-            [paths.targetSrc, paths.targetDev],
-            [paths.targetPackageJson],
-          ),
-      ].filter(Boolean),
+      plugins: resolvePlugins,
     },
     module: {
       rules: loaders,

packages/cli/src/lib/bundler/transforms.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import webpack, { ModuleOptions, WebpackPluginInstance } from 'webpack';
+import { ModuleOptions, WebpackPluginInstance } from 'webpack';
 import MiniCssExtractPlugin from 'mini-css-extract-plugin';
 import { svgrTemplate } from '../svgrTemplate';
 import ReactRefreshPlugin from '@pmmmwh/react-refresh-webpack-plugin';
@@ -110,11 +110,10 @@ export const transforms = (options: TransformOptions): Transforms => {
       test: [/\.icon\.svg$/],
       use: [
         {
-          loader: require.resolve('@sucrase/webpack-loader'),
+          loader: require.resolve('esbuild-loader'),
           options: {
-            transforms: ['jsx'],
-            disableESTransforms: true,
-            production: !isDev,
+            loader: 'jsx',
+            target: 'es2015',
           },
         },
         {
@@ -180,8 +179,12 @@ export const transforms = (options: TransformOptions): Transforms => {
   const plugins = new Array<WebpackPluginInstance>();
 
   if (isDev) {
-    plugins.push(new ReactRefreshPlugin());
-    // plugins.push(new webpack.HotModuleReplacementPlugin());
+    plugins.push(
+      new ReactRefreshPlugin({
+        esModule: true,
+        overlay: { sockProtocol: 'ws' },
+      }),
+    );
   } else {
     plugins.push(
       new MiniCssExtractPlugin({