@startupjs/bundler 0.55.4 → 0.55.8

package/lib/eliminatorLoader.js

@@ -0,0 +1,57 @@
+const babel = require('@babel/core')
+
+const PLUGIN_KEYS = ['name', 'for']
+const ALL_ENVS = ['client', 'isomorphic', 'server', 'build']
+
+module.exports = function eliminatorLoader (source) {
+  const envs = this.query.envs
+  if (!envs) throw Error("getEliminatorLoader: envs not provided (for example ['client', 'isomorphic'])")
+  const filename = this.resourcePath
+
+  let code = source
+
+  // first we need to transform pug to jsx
+  // so that eliminator doesn't think that there are unused variables
+  code = babel.transformSync(code, {
+    filename,
+    babelrc: false,
+    configFile: false,
+    plugins: [
+      require('@babel/plugin-syntax-jsx'),
+      [require('babel-plugin-transform-react-pug'), {
+        classAttribute: 'styleName'
+      }],
+      [require('@startupjs/babel-plugin-react-pug-classnames'), {
+        classAttribute: 'styleName'
+      }],
+      require('@startupjs/babel-plugin-startupjs-plugins')
+    ]
+  }).code
+
+  // then we run the actual eliminator to remove env-specific stuff
+  code = babel.transformSync(code, {
+    filename,
+    babelrc: false,
+    configFile: false,
+    plugins: [
+      require('@babel/plugin-syntax-jsx'),
+      [require('@startupjs/babel-plugin-eliminator'), {
+        keepObjectKeysOfFunction: {
+          createProject: {
+            magicImports: ['startupjs/registry', 'startupjs/registry.js', '@startupjs/registry', '@startupjs/registry.js'],
+            targetObjectJsonPath: '$.plugins.*',
+            ensureOnlyKeys: ['client', 'isomorphic', 'server', 'build'],
+            keepKeys: envs
+          },
+          createPlugin: {
+            magicImports: ['startupjs/registry', 'startupjs/registry.js', '@startupjs/registry', '@startupjs/registry.js'],
+            ensureOnlyKeys: [...PLUGIN_KEYS, ...ALL_ENVS],
+            keepKeys: [...PLUGIN_KEYS, ...envs]
+          }
+        }
+      }]
+    ]
+  }).code
+
+  return code
+}

package/lib/rnTransformer.js

@@ -7,6 +7,7 @@ const stylusToCssLoader = require('./stylusToCssLoader')
 const cssToReactNativeLoader = require('./cssToReactNativeLoader')
 const mdxExamplesLoader = require('./mdxExamplesLoader')
 const getMDXLoader = require('./getMDXLoader')
+const eliminatorLoader = require('./eliminatorLoader')
 const callLoader = require('./callLoader')
 
 module.exports.transform = async function ({ src, filename, options = {} }) {
@@ -22,7 +23,13 @@ module.exports.transform = async function ({ src, filename, options = {} }) {
     return upstreamTransformer.transform({ src, filename, options })
   } else if (/\.svg$/.test(filename)) {
     return svgTransformer.transform({ src, filename, options })
+  } else if (/(?:[./]plugin\.[mc]?[jt]sx?|startupjs\.config\.js)$/.test(filename)) {
+    src = callLoader(eliminatorLoader, src, filename, { envs: ['client', 'isomorphic'] })
+    return upstreamTransformer.transform({ src, filename, options })
   } else if (/\.[cm]?jsx?$/.test(filename) && /['"]startupjs['"]/.test(src)) {
+    // TODO: This particular check and transform is probably not needed anymore since default one
+    //       will handle all .js files anyways no matter whether 'startupjs' library
+    //       is used inside or not.
     return upstreamTransformer.transform({ src, filename, options })
   } else if (/\.mdx?$/.test(filename)) {
     const mdxLoader = await getMDXLoader()

package/lib/yamlLoader.js

@@ -0,0 +1,6 @@
+const yaml = require('js-yaml')
+
+module.exports = function mdxExamplesLoader (source) {
+  const yamlData = yaml.load(source)
+  return `export default ${JSON.stringify(yamlData)};`
+}

package/nodeLoader.mjs

@@ -0,0 +1,49 @@
+import { readFile } from 'node:fs/promises'
+import { fileURLToPath } from 'node:url'
+import callLoader from './lib/callLoader.js'
+import yamlLoader from './lib/yamlLoader.js'
+import eliminatorLoader from './lib/eliminatorLoader.js'
+
+export function resolve (specifier, context, nextResolve) {
+  const { parentURL = null } = context
+
+  // Handling YAML files
+  if (specifier.endsWith('.yaml')) {
+    return {
+      shortCircuit: true,
+      url: new URL(specifier, parentURL).href
+    }
+  }
+
+  // Let Node.js handle all other specifiers.
+  return nextResolve(specifier, context, nextResolve)
+}
+
+export async function load (url, context, nextLoad) {
+  // If it's a YAML file, read it, parse it and return it as JavaScript source code
+  if (/\.yaml$/.test(url)) {
+    const filePath = fileURLToPath(url)
+    let source = await readFile(filePath, 'utf8')
+    source = callLoader(yamlLoader, source, filePath)
+    return {
+      format: 'module',
+      shortCircuit: true,
+      source
+    }
+  }
+
+  // process code elimination of other envs for *.plugin.js and startupjs.config.js
+  if (/(?:[./]plugin\.[mc]?[jt]sx?|startupjs\.config\.js)$/.test(url)) {
+    const filePath = fileURLToPath(url)
+    let source = await readFile(filePath, 'utf8')
+    source = callLoader(eliminatorLoader, source, filePath, { envs: ['server', 'isomorphic'] })
+    return {
+      format: 'module',
+      shortCircuit: true,
+      source
+    }
+  }
+
+  // Let Node.js handle all other URLs.
+  return nextLoad(url, context, nextLoad)
+}

package/nodeRegister.mjs

@@ -0,0 +1,5 @@
+// Register the node loader which actually processes custom file extensions
+// and pre-processes .js source code
+import { register } from 'node:module'
+
+register('./nodeLoader.mjs', import.meta.url)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@startupjs/bundler",
-  "version": "0.55.4",
+  "version": "0.55.8",
   "description": "Opinionated scripts and configs to develop a react-native-web project",
   "main": "index.js",
   "publishConfig": {
@@ -15,18 +15,23 @@
   },
   "license": "MIT",
   "dependencies": {
+    "@babel/core": "^7.9.0",
+    "@babel/plugin-syntax-jsx": "^7.0.0",
     "@babel/polyfill": "^7.8.0",
     "@mdx-js/loader": "^2.3.0",
     "@mdx-js/mdx": "^2.3.0",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.1",
     "@startupjs/babel-plugin-react-css-modules": "^6.5.4-1",
+    "@startupjs/babel-plugin-react-pug-classnames": "^0.55.8",
+    "@startupjs/babel-plugin-startupjs-plugins": "^0.55.8",
     "@startupjs/css-to-react-native-transform": "^1.9.0-2",
-    "@startupjs/plugin": "^0.55.1",
+    "@startupjs/plugin": "^0.55.8",
     "@svgr/webpack": "~7.0.0",
     "assets-webpack-plugin": "^7.1.1",
     "autoprefixer": "^10.4.0",
     "babel-loader": "^8.2.3",
-    "babel-preset-startupjs": "^0.55.4",
+    "babel-plugin-transform-react-pug": "^7.0.1",
+    "babel-preset-startupjs": "^0.55.8",
     "css-loader": "^6.5.0",
     "css-minimizer-webpack-plugin": "^5.0.0",
     "file-loader": "^6.2.0",
@@ -50,5 +55,5 @@
   "peerDependencies": {
     "react-native-svg": "*"
   },
-  "gitHead": "6ad2cc77b50d4e45abc6383e135689e0c313af3b"
+  "gitHead": "75f57690644950055f8c8cb9afa265eb44f594fd"
 }

package/webpack.web.config.js

@@ -205,22 +205,35 @@ module.exports = function getConfig (env, {
       rules: [
         {
           test: /\.[mc]?[jt]sx?$/,
-          resolve: {
-            fullySpecified: false
-          },
-          exclude: /node_modules/,
-          use: [
-            { loader: 'babel-loader' }
-          ]
-        },
-        {
-          test: /\.[mc]?[jt]sx?$/,
-          resolve: {
-            fullySpecified: false
-          },
-          include: forceCompileModulesExpression,
-          use: [
-            { loader: 'babel-loader' }
+          oneOf: [
+            {
+              // process code elimination of other envs for *.plugin.js and startupjs.config.js
+              test: /(?:[./]plugin\.[mc]?[jt]sx?|startupjs\.config\.js)$/,
+              resolve: { fullySpecified: false },
+              use: [
+                { loader: 'babel-loader' },
+                {
+                  loader: require.resolve('./lib/eliminatorLoader.js'),
+                  options: {
+                    envs: ['client', 'isomorphic']
+                  }
+                }
+              ]
+            },
+            {
+              exclude: /node_modules/,
+              resolve: { fullySpecified: false },
+              use: [
+                { loader: 'babel-loader' }
+              ]
+            },
+            {
+              include: forceCompileModulesExpression,
+              resolve: { fullySpecified: false },
+              use: [
+                { loader: 'babel-loader' }
+              ]
+            }
           ]
         },
         {