@s-ui/bundler 9.37.0 → 9.39.0-typescript.1

package/.swcrc

@@ -0,0 +1,78 @@
+[
+  {
+    "test": ".tsx?$",
+    "minify": true,
+    "jsc": {
+      "parser": {
+        "syntax": "typescript",
+        "tsx": true,
+        "dynamicImport": true,
+        "privateMethod": true,
+        "functionBind": true,
+        "exportDefaultFrom": true,
+        "exportNamespaceFrom": true,
+        "decorators": true,
+        "decoratorsBeforeExport": true,
+        "topLevelAwait": true,
+        "importMeta": true
+      },
+      "transform": {
+        "legacyDecorator": true,
+        "react": {
+          "useBuiltins": true,
+          "runtime": "automatic"
+        }
+      },
+      "target": "es5",
+      "loose": true,
+      "externalHelpers": true
+    },
+    "env": {
+      "targets": {
+        "ie": "11"
+      },
+      "dynamicImport": true,
+      "loose": true,
+      "mode": "entry",
+      "coreJs": 3
+    }
+  },
+  {
+    "test": ".jsx?$",
+    "minify": true,
+    "jsc": {
+      "parser": {
+        "syntax": "ecmascript",
+        "jsx": true,
+        "dynamicImport": true,
+        "privateMethod": true,
+        "functionBind": true,
+        "exportDefaultFrom": true,
+        "exportNamespaceFrom": true,
+        "decorators": true,
+        "decoratorsBeforeExport": true,
+        "topLevelAwait": true,
+        "importMeta": true
+      },
+      "transform": {
+        "legacyDecorator": true,
+        "react": {
+          "useBuiltins": true,
+          "runtime": "automatic"
+        }
+      },
+      "target": "es5",
+      "loose": true,
+      "externalHelpers": true
+    },
+    "env": {
+      "targets": {
+        "ie": "11"
+      },
+      "dynamicImport": true,
+      "loose": true,
+      "mode": "entry",
+      "coreJs": 3
+    }
+  }
+]

package/README.md

@@ -163,7 +163,7 @@ This tool works with zero configuration out the box but you could use some confi
 {
   "config": {
     "sui-bundler": {
-      "supportLegacyBrowsers": false, // default
+      "supportLegacyBrowsers": true, // default
       "onlyHash": "true",
       "env": ["APP_NAME", ["USER", "DEFAULT_VALUE"]],
       "vendor": ["react", "react-dom"],

package/bin/sui-bundler-dev.js

@@ -67,12 +67,7 @@ const start = async ({
 } = {}) => {
   clearConsole()
   // Warn and crash if required files are missing
-  if (
-    !checkRequiredFiles([
-      path.join(config.context, 'index.html'),
-      path.join(config.context, 'app.js')
-    ])
-  ) {
+  if (!checkRequiredFiles([path.join(config.context, 'index.html')])) {
     log.error(
       `✖ Required files are missing, create and index.html and app.js inside your src folder.`
     )

package/bin/sui-bundler.js

@@ -11,7 +11,7 @@ program
   .command('lib', 'Compile a library to a bundle with chunks.')
   .command(
     'analyzer',
-    'Compile all assets and create a HTML inpector for your bundle'
+    'Compile all assets and create a HTML inspector for your bundle'
   )
 
 program.parse(process.argv)

package/loaders/linkLoaderConfigBuilder.js

@@ -49,7 +49,7 @@ module.exports = ({config, packagesToLink, linkAll}) => {
    * if neccesary
    */
   const linkLoader = {
-    test: /\.(jsx?|scss)$/,
+    test: /\.(jsx?|tsx?|scss)$/,
     enforce: 'pre', // this will ensure is execute before transformations
     use: {
       loader: require.resolve('./LinkLoader'),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@s-ui/bundler",
-  "version": "9.37.0",
+  "version": "9.39.0-typescript.1",
   "description": "Config-free bundler for ES6 React apps.",
   "bin": {
     "sui-bundler": "./bin/sui-bundler.js"
@@ -24,6 +24,8 @@
     "@babel/core": "7.18.10",
     "@s-ui/helpers": "1",
     "@s-ui/sass-loader": "1",
+    "@swc/core": "1.3.52",
+    "@swc/helpers": "0.5.0",
     "address": "1.2.0",
     "autoprefixer": "10.4.8",
     "babel-loader": "8.2.5",
@@ -46,6 +48,7 @@
     "stream-http": "3.2.0",
     "strip-ansi": "6.0.1",
     "style-loader": "3.3.1",
+    "swc-loader": "^0.2.1",
     "url": "0.11.0",
     "webpack": "5.74.0",
     "webpack-dev-server": "4.10.0",

package/shared/config.js

@@ -7,7 +7,7 @@ const {'sui-bundler': config = {}} = packageJsonConfig
 const {
   extractComments = false,
   sourcemaps,
-  supportLegacyBrowsers = false
+  supportLegacyBrowsers = true
 } = config
 
 exports.config = config

package/shared/index.js

@@ -1,6 +1,6 @@
 const {config} = require('./config.js')
 
-exports.MAIN_ENTRY_POINT = './app.js'
+exports.MAIN_ENTRY_POINT = './app'
 exports.config = config
 
 exports.cleanList = list => list.filter(Boolean)

package/shared/module-rules-babel.js

@@ -1,32 +1,94 @@
+/* eslint-disable no-console */
+import fs from 'fs-extra'
+
 const path = require('path')
 const {config} = require('./index.js')
 
+const tsConfigPath = path.join(process.cwd(), 'tsconfig.json')
+let isTypeScriptEnabled = false
+
+try {
+  if (fs.existsSync(tsConfigPath)) {
+    isTypeScriptEnabled = true
+  }
+} catch (err) {
+  console.error(err)
+}
+
 const EXCLUDED_FOLDERS_REGEXP = new RegExp(
   `node_modules(?!${path.sep}@s-ui(${path.sep}studio)(${path.sep}workbench)?${path.sep}src)`
 )
 
-module.exports = ({isServer = false} = {}) => ({
-  test: /\.jsx?$/,
-  exclude: EXCLUDED_FOLDERS_REGEXP,
-  use: [
-    {
-      loader: require.resolve('babel-loader'),
-      options: {
-        cacheDirectory: true,
-        cacheCompression: false,
-        babelrc: false,
-        compact: true,
-        presets: [
-          [
-            require.resolve('babel-preset-sui'),
-            {
-              isServer,
-              supportLegacyBrowsers: true,
-              targets: config.targets
+module.exports = ({isServer = false, supportLegacyBrowsers = true} = {}) =>
+  isTypeScriptEnabled
+    ? {
+        test: /\.(js|ts)x?$/,
+        exclude: EXCLUDED_FOLDERS_REGEXP,
+        use: [
+          {
+            loader: require.resolve('swc-loader'),
+            options: {
+              minify: true,
+              jsc: {
+                parser: {
+                  syntax: 'typescript',
+                  tsx: true,
+                  dynamicImport: true,
+                  privateMethod: true,
+                  functionBind: true,
+                  exportDefaultFrom: true,
+                  exportNamespaceFrom: true,
+                  decorators: true,
+                  decoratorsBeforeExport: true,
+                  topLevelAwait: true,
+                  importMeta: true
+                },
+                transform: {
+                  legacyDecorator: true,
+                  react: {
+                    useBuiltins: true,
+                    runtime: 'automatic'
+                  }
+                },
+                target: 'es5',
+                loose: true,
+                externalHelpers: true
+              },
+              env: {
+                targets: {
+                  ie: '11'
+                },
+                dynamicImport: true,
+                loose: true,
+                mode: 'entry',
+                coreJs: 3
+              }
+            }
+          }
+        ]
+      }
+    : {
+        test: /\.jsx?$/,
+        exclude: EXCLUDED_FOLDERS_REGEXP,
+        use: [
+          {
+            loader: require.resolve('babel-loader'),
+            options: {
+              cacheDirectory: true,
+              cacheCompression: false,
+              babelrc: false,
+              compact: true,
+              presets: [
+                [
+                  require.resolve('babel-preset-sui'),
+                  {
+                    isServer,
+                    isModern: !supportLegacyBrowsers,
+                    targets: config.targets
+                  }
+                ]
+              ]
             }
-          ]
+          }
         ]
       }
-    }
-  ]
-})

package/webpack.config.dev.js

@@ -14,6 +14,7 @@ const {
 const definePlugin = require('./shared/define.js')
 const manifestLoaderRules = require('./shared/module-rules-manifest-loader.js')
 const {aliasFromConfig, defaultAlias} = require('./shared/resolve-alias.js')
+const {supportLegacyBrowsers} = require('./shared/config.js')
 
 const {resolveLoader} = require('./shared/resolve-loader.js')
 const createBabelRules = require('./shared/module-rules-babel.js')
@@ -46,7 +47,7 @@ const webpackConfig = {
       timers: false
     },
     modules: ['node_modules', path.resolve(process.cwd())],
-    extensions: ['.js', '.json']
+    extensions: ['.js', '.tsx', '.ts', '.json']
   },
   stats: 'errors-only',
   entry: cleanList([
@@ -82,7 +83,7 @@ const webpackConfig = {
   resolveLoader,
   module: {
     rules: cleanList([
-      createBabelRules(),
+      createBabelRules({supportLegacyBrowsers}),
       {
         test: /(\.css|\.scss)$/,
         use: cleanList([

package/webpack.config.lib.js

@@ -11,7 +11,11 @@ const minifyJs = require('./shared/minify-js.js')
 const definePlugin = require('./shared/define.js')
 const createBabelRules = require('./shared/module-rules-babel.js')
 const sassRules = require('./shared/module-rules-sass.js')
-const {extractComments, sourceMap} = require('./shared/config.js')
+const {
+  extractComments,
+  sourceMap,
+  supportLegacyBrowsers
+} = require('./shared/config.js')
 const {aliasFromConfig} = require('./shared/resolve-alias.js')
 
 const cssFileName = 'styles.css'
@@ -63,6 +67,6 @@ module.exports = {
     definePlugin()
   ]),
   module: {
-    rules: [createBabelRules(), sassRules]
+    rules: [createBabelRules({supportLegacyBrowsers}), sassRules]
   }
 }

package/webpack.config.prod.js

@@ -114,7 +114,7 @@ const webpackConfig = {
   ]),
   module: {
     rules: cleanList([
-      createBabelRules(),
+      createBabelRules({supportLegacyBrowsers}),
       sassRules,
       when(config['externals-manifest'], () =>
         manifestLoaderRules(config['externals-manifest'])