@startupjs/bundler 0.56.0-alpha.0 → 0.56.0-alpha.2

package/lib/eliminatorLoader.js

@@ -1,17 +1,20 @@
+// TODO: add support for source maps
 const babel = require('@babel/core')
+const { isStartupjsPluginEcosystemFile, CONFIG_FILENAME_REGEX } = require('./utils')
 
 const PLUGIN_KEYS = ['name', 'for']
+const PROJECT_KEYS = ['plugins', 'modules']
 const ALL_ENVS = ['client', 'isomorphic', 'server', 'build']
 const MAGIC_IMPORTS = ['startupjs/registry', '@startupjs/registry']
-const MAGIC_IMPORTS_REGEX = /['"]@?startupjs\/registry['"]/
 
 module.exports = function eliminatorLoader (source) {
-  // ensure that this loader is only used when the magic import is present
-  if (!MAGIC_IMPORTS_REGEX.test(source)) return source
+  const filename = this.resourcePath
+
+  // ensure that this loader is only used on plugins, startupjs.config.js and loadStartupjsConfig.js files
+  if (!(isStartupjsPluginEcosystemFile(filename))) return source
 
   const envs = this.query.envs
   if (!envs) throw Error("eliminatorLoader: envs not provided (for example ['client', 'isomorphic'])")
-  const filename = this.resourcePath
 
   let code = source
 
@@ -50,19 +53,31 @@ module.exports = function eliminatorLoader (source) {
       // For example, only keep code related to 'client' and 'isomorphic' envs
       // (in which case any code related to 'server' and 'build' envs will be removed)
       [require('@startupjs/babel-plugin-eliminator'), {
-        keepObjectKeysOfFunction: {
-          createProject: {
-            magicImports: MAGIC_IMPORTS,
-            targetObjectJsonPath: '$.plugins.*',
-            ensureOnlyKeys: ALL_ENVS,
-            keepKeys: envs
-          },
-          createPlugin: {
-            magicImports: MAGIC_IMPORTS,
-            ensureOnlyKeys: [...PLUGIN_KEYS, ...ALL_ENVS],
-            keepKeys: [...PLUGIN_KEYS, ...envs]
-          }
-        }
+        trimObjects: [{
+          magicFilenameRegex: CONFIG_FILENAME_REGEX,
+          magicExport: 'default',
+          targetObjectJsonPath: '$.modules.*',
+          ensureOnlyKeys: ALL_ENVS,
+          keepKeys: envs
+        }, {
+          magicFilenameRegex: CONFIG_FILENAME_REGEX,
+          magicExport: 'default',
+          targetObjectJsonPath: '$.plugins.*',
+          ensureOnlyKeys: ALL_ENVS,
+          keepKeys: envs
+        }, {
+          magicFilenameRegex: CONFIG_FILENAME_REGEX,
+          magicExport: 'default',
+          targetObjectJsonPath: '$',
+          // envs on the top level are the alias for '$.modules.startupjs'
+          ensureOnlyKeys: [...PROJECT_KEYS, ...ALL_ENVS],
+          keepKeys: [...PROJECT_KEYS, ...envs]
+        }, {
+          functionName: 'createPlugin',
+          magicImports: MAGIC_IMPORTS,
+          ensureOnlyKeys: [...PLUGIN_KEYS, ...ALL_ENVS],
+          keepKeys: [...PLUGIN_KEYS, ...envs]
+        }]
       }]
     ]
   }).code

package/lib/stylusToCssLoader.js

@@ -3,15 +3,12 @@
 const platformSingleton = require(
   '@startupjs/babel-plugin-rn-stylename-inline/platformSingleton'
 )
-const fs = require('fs')
-const path = require('path')
+const { existsSync } = require('fs')
+const { join } = require('path')
 const stylus = require('stylus')
-const STYLES_PATH = path.join(process.cwd(), 'styles/index.styl')
 
+const PROJECT_STYLES_PATH = join(process.cwd(), 'styles/index.styl')
 let UI_STYLES_PATH
-try {
-  UI_STYLES_PATH = require.resolve('@startupjs/ui/styles/index.styl')
-} catch (err) {}
 
 function renderToCSS (src, filename) {
   let compiled
@@ -24,13 +21,13 @@ function renderToCSS (src, filename) {
     compiler.define(`__${platform.toUpperCase()}__`, true)
   }
 
-  if (fs.existsSync(UI_STYLES_PATH)) {
+  if (checkUiStylesExist()) {
     compiler.import(UI_STYLES_PATH)
   }
 
   // TODO: Make this a setting
-  if (fs.existsSync(STYLES_PATH)) {
-    compiler.import(STYLES_PATH)
+  if (checkProjectStylesExist()) {
+    compiler.import(PROJECT_STYLES_PATH)
   }
 
   compiler.render(function (err, res) {
@@ -46,3 +43,28 @@ function renderToCSS (src, filename) {
 module.exports = function stylusToReactNative (source) {
   return renderToCSS(source, this.resourcePath)
 }
+
+// check if @startupjs/ui is being used to load styles file from it, cache result for 5 seconds
+let uiStylesExist
+let uiStylesLastChecked = 0
+function checkUiStylesExist () {
+  if (uiStylesLastChecked + 5000 > Date.now()) return uiStylesExist
+  uiStylesLastChecked = Date.now()
+  try {
+    UI_STYLES_PATH = join(require.resolve('@startupjs/ui'), '../styles/index.styl')
+    uiStylesExist = existsSync(UI_STYLES_PATH)
+  } catch {
+    uiStylesExist = false
+  }
+  return uiStylesExist
+}
+
+// check if project styles file exist, cache result for 5 seconds
+let projectStylesExist
+let projectStylesLastChecked = 0
+function checkProjectStylesExist () {
+  if (projectStylesLastChecked + 5000 > Date.now()) return projectStylesExist
+  projectStylesLastChecked = Date.now()
+  projectStylesExist = existsSync(PROJECT_STYLES_PATH)
+  return projectStylesExist
+}

package/lib/utils.js

@@ -0,0 +1,12 @@
+// NOTE: startupjs.config.cjs is used by the old bundler. This regex does not include it.
+exports.CONFIG_FILENAME_REGEX = /(?:^|[\\/])startupjs\.config\.m?[jt]sx?$/
+exports.PLUGIN_FILENAME_REGEX = /(?:^|[.\\/])plugin\.[mc]?[jt]sx?$/
+exports.LOAD_CONFIG_FILENAME_REGEX = /(?:^|[\\/])loadStartupjsConfig\.m?[jt]sx?$/
+
+exports.isStartupjsPluginEcosystemFile = filename => {
+  return (
+    exports.PLUGIN_FILENAME_REGEX.test(filename) ||
+    exports.CONFIG_FILENAME_REGEX.test(filename) ||
+    exports.LOAD_CONFIG_FILENAME_REGEX.test(filename)
+  )
+}

package/metro-babel-transformer.js

@@ -31,7 +31,7 @@ module.exports.transform = async function startupjsMetroBabelTransform ({
   }
 
   // js transformations
-  if (/(?:[./]plugin\.[mc]?[jt]sx?|startupjs\.config\.[mc]?[jt]sx?)$/.test(filename)) {
+  if (/\.[mc]?[jt]sx?$/.test(filename)) {
     src = callLoader(eliminatorLoader, src, filename, { envs: ['client', 'isomorphic'] })
   }
   if ((/\.mdx?$/.test(filename) || /\.[mc]?[jt]sx?$/.test(filename)) && /['"](?:startupjs|@env)['"]/.test(src)) {

package/metro-config.js

@@ -1,3 +1,5 @@
+const connect = require('connect')
+
 // To pass existing config for modification, pass it as 'upstreamConfig' in options:
 //   config = getDefaultConfig(__dirname, { upstreamConfig })
 exports.getDefaultConfig = function getDefaultConfig (projectRoot, { upstreamConfig } = {}) {
@@ -16,7 +18,20 @@ exports.getDefaultConfig = function getDefaultConfig (projectRoot, { upstreamCon
         ...(isExpo ? ['expo.ts', 'expo.tsx', 'expo.js', 'expo.jsx', 'expo.mjs', 'expo.cjs'] : []),
         ...(upstreamConfig.resolver.sourceExts || []),
         ...['mjs', 'cjs', 'md', 'mdx', 'css', 'styl', 'svg']
-      ]))
+      ])),
+      unstable_enablePackageExports: true
+    },
+    server: {
+      ...upstreamConfig.server,
+      // TODO: implement a simple parsing of startupjs.config.js
+      //       to figure out whether we need to load 'server' and 'isomorphic'
+      //       envs or only the 'build' one.
+      //       If $.isomorphic.server is turned off then we don't need the enhanceMiddleware at all
+      enhanceMiddleware: metroMiddleware => {
+        return connect()
+          .use(metroMiddleware)
+          .use(getStartupjsMiddleware())
+      }
     }
   }
 }
@@ -50,3 +65,24 @@ function checkIfExpo (upstreamConfig) {
     return false
   }
 }
+
+function getStartupjsMiddleware () {
+  const middlewarePromise = (async () => {
+    await import('./nodeRegister.mjs')
+    await import('@startupjs/registry/loadStartupjsConfig.auto')
+    const { ROOT_MODULE: MODULE } = await import('@startupjs/registry')
+    if (!MODULE.options.server) return
+    const { createMiddleware } = await import('@startupjs/server')
+    return (await createMiddleware()).middleware
+  })()
+  return function startupjsMiddleware (req, res, next) {
+    (async () => {
+      try {
+        const middleware = await middlewarePromise
+        return middleware ? middleware.apply(this, arguments) : next()
+      } catch (err) {
+        return next(err)
+      }
+    })()
+  }
+}

package/nodeLoader.mjs

@@ -3,6 +3,7 @@ import { fileURLToPath } from 'node:url'
 import callLoader from './lib/callLoader.js'
 import yamlLoader from './lib/yamlLoader.js'
 import eliminatorLoader from './lib/eliminatorLoader.js'
+import { isStartupjsPluginEcosystemFile } from './lib/utils.js'
 
 export function resolve (specifier, context, nextResolve) {
   const { parentURL = null } = context
@@ -33,7 +34,7 @@ export async function load (url, context, nextLoad) {
   }
 
   // process code elimination of other envs for *.plugin.js and startupjs.config.js
-  if (/(?:[./]plugin\.[mc]?[jt]sx?|startupjs\.config\.js)$/.test(url)) {
+  if (isStartupjsPluginEcosystemFile(url)) {
     const filePath = fileURLToPath(url)
     let source = await readFile(filePath, 'utf8')
     source = callLoader(eliminatorLoader, source, filePath, { envs: ['server', 'isomorphic'] })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@startupjs/bundler",
-  "version": "0.56.0-alpha.0",
+  "version": "0.56.0-alpha.2",
   "description": "Opinionated scripts and configs to develop a react-native-web project",
   "main": "index.js",
   "publishConfig": {
@@ -21,12 +21,14 @@
     "@mdx-js/loader": "^2.3.0",
     "@mdx-js/mdx": "^2.3.0",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.1",
-    "@startupjs/babel-plugin-eliminator": "^0.56.0-alpha.0",
+    "@startupjs/babel-plugin-eliminator": "^0.56.0-alpha.1",
     "@startupjs/babel-plugin-react-css-modules": "^6.5.4-1",
     "@startupjs/babel-plugin-react-pug-classnames": "^0.56.0-alpha.0",
-    "@startupjs/babel-plugin-startupjs-plugins": "^0.56.0-alpha.0",
+    "@startupjs/babel-plugin-startupjs-plugins": "^0.56.0-alpha.1",
     "@startupjs/css-to-react-native-transform": "^1.9.0-2",
     "@startupjs/plugin": "^0.56.0-alpha.0",
+    "@startupjs/registry": "^0.56.0-alpha.2",
+    "@startupjs/server": "^0.56.0-alpha.2",
     "@svgr/core": "^8.1.0",
     "@svgr/plugin-jsx": "^8.1.0",
     "@svgr/plugin-svgo": "^8.1.0",
@@ -35,7 +37,8 @@
     "autoprefixer": "^10.4.0",
     "babel-loader": "^8.2.3",
     "babel-plugin-transform-react-pug": "^7.0.1",
-    "babel-preset-startupjs": "^0.56.0-alpha.0",
+    "babel-preset-startupjs": "^0.56.0-alpha.2",
+    "connect": "^3.7.0",
     "css-loader": "^6.5.0",
     "css-minimizer-webpack-plugin": "^5.0.0",
     "file-loader": "^6.2.0",
@@ -58,5 +61,5 @@
   "peerDependencies": {
     "react-native-svg": "*"
   },
-  "gitHead": "076772b216a09281ed38b32866b576024562f099"
+  "gitHead": "97f1ce92de18e3300d02321986936890df822dc2"
 }