@startupjs/bundler 0.41.4 → 0.43.0

package/lib/cssToReactNativeLoader.js

@@ -9,6 +9,8 @@ module.exports = function cssToReactNative (source) {
   for (const key in cssObject.__exportProps || {}) {
     cssObject[key] = parseStylValue(cssObject.__exportProps[key])
   }
+  // save hash to use with the caching system of @startupjs/cache
+  cssObject.__hash__ = simpleNumericHash(JSON.stringify(cssObject))
   return 'module.exports = ' + JSON.stringify(cssObject)
 }
 
@@ -76,3 +78,9 @@ function escapeExport (source) {
 
   return source
 }
+
+// ref: https://gist.github.com/hyamamoto/fd435505d29ebfa3d9716fd2be8d42f0?permalink_comment_id=2694461#gistcomment-2694461
+function simpleNumericHash (s) {
+  for (var i = 0, h = 0; i < s.length; i++) h = Math.imul(31, h) + s.charCodeAt(i) | 0
+  return h
+}

package/lib/rnTransformer.js

@@ -7,7 +7,6 @@ const stylusToCssLoader = require('./stylusToCssLoader')
 const cssToReactNativeLoader = require('./cssToReactNativeLoader')
 const mdxExamplesLoader = require('./mdxExamplesLoader')
 const mdxLoader = require('./mdxLoader')
-const replaceObserverLoader = require('./replaceObserverLoader')
 const callLoader = require('./callLoader')
 
 module.exports.transform = function ({ src, filename, options = {} }) {
@@ -24,10 +23,6 @@ module.exports.transform = function ({ src, filename, options = {} }) {
   } else if (/\.svg$/.test(filename)) {
     return svgTransformer.transform({ src, filename, options })
   } else if (/\.[cm]?jsx?$/.test(filename) && /['"]startupjs['"]/.test(src)) {
-    // Fix Fast Refresh to work with observer() decorator.
-    // For details view ./replaceObserverLoader.js
-    src = src.replace(/(?:\/\*(?:[\s\S]*?)\*\/)|(?:^\s*\/\/(?:.*)$)/gm, '')
-    src = callLoader(replaceObserverLoader, src, filename)
     return upstreamTransformer.transform({ src, filename, options })
   } else if (/\.mdx?$/.test(filename)) {
     src = callLoader(mdxExamplesLoader, src, filename)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@startupjs/bundler",
-  "version": "0.41.4",
+  "version": "0.43.0",
   "description": "Opinionated scripts and configs to develop a react-native-web project",
   "main": "index.js",
   "publishConfig": {
@@ -19,13 +19,14 @@
     "@mdx-js/loader": "^1.6.22",
     "@mdx-js/mdx": "^1.6.22",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.1",
+    "@startupjs/babel-plugin-react-css-modules": "^6.5.4-1",
     "@startupjs/css-to-react-native-transform": "^1.9.0-1",
-    "@startupjs/plugin": "^0.41.2",
+    "@startupjs/plugin": "^0.43.0",
     "@svgr/webpack": "~5.5.0",
     "assets-webpack-plugin": "^7.1.1",
     "autoprefixer": "^10.4.0",
     "babel-loader": "^8.2.3",
-    "babel-preset-startupjs": "^0.41.4",
+    "babel-preset-startupjs": "^0.43.0",
     "css-loader": "^6.5.0",
     "css-minimizer-webpack-plugin": "^3.1.1",
     "file-loader": "^6.2.0",
@@ -49,5 +50,5 @@
   "peerDependencies": {
     "react-native-svg": ">= 12.1.0"
   },
-  "gitHead": "72a5409df2bace2e81385b40be4246282155fbaf"
+  "gitHead": "71591aee88a27e1726252d560c5a1d99fa86b559"
 }

package/webpack.web.config.js

@@ -1,6 +1,6 @@
 const { getPluginConfigs } = require('@startupjs/plugin/manager.cjs')
+const { getLocalIdent } = require('@startupjs/babel-plugin-react-css-modules/utils')
 const pickBy = require('lodash/pickBy')
-const pick = require('lodash/pick')
 const fs = require('fs')
 const path = require('path')
 const AssetsPlugin = require('assets-webpack-plugin')
@@ -18,7 +18,6 @@ const BUILD_PATH = path.join(process.cwd(), BUILD_DIR)
 const BUNDLE_NAME = 'main'
 const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin')
 const webpack = require('webpack')
-const { getJsxRule } = require('./helpers')
 const DEFAULT_MODE = 'react-native'
 const PLUGINS = getPluginConfigs()
 
@@ -34,7 +33,8 @@ const DEFAULT_ALIAS = {
   // fix warning requiring './locale': https://github.com/moment/moment/issues/1435
   moment$: 'moment/moment.js',
   'react-native': 'react-native-web',
-  'react-router-native': 'react-router-dom'
+  'react-router-native': 'react-router-dom',
+  '@fortawesome/react-native-fontawesome': '@fortawesome/react-fontawesome'
 }
 
 let DEFAULT_ENTRIES = [
@@ -185,36 +185,30 @@ module.exports = function getConfig (env, {
     module: {
       rules: [
         {
-          test: getJsxRule().test,
+          test: /\.[mc]?[jt]sx?$/,
           resolve: {
             fullySpecified: false
           },
           exclude: /node_modules/,
           use: [
-            pick(getJsxRule(), ['loader', 'options']),
-            {
-              loader: require.resolve('./lib/replaceObserverLoader.js')
-            }
+            { loader: 'babel-loader' }
           ]
         },
         {
-          test: getJsxRule().test,
+          test: /\.[mc]?[jt]sx?$/,
           resolve: {
             fullySpecified: false
           },
           include: new RegExp(`node_modules/(?:react-native-(?!web)|${forceCompileModules.join('|')})`),
           use: [
-            pick(getJsxRule(), ['loader', 'options']),
-            {
-              loader: require.resolve('./lib/replaceObserverLoader.js')
-            }
+            { loader: 'babel-loader' }
           ]
         },
         {
           test: /\.mdx?$/,
           exclude: /node_modules/,
           use: [
-            pick(getJsxRule(), ['loader', 'options']),
+            { loader: 'babel-loader' },
             {
               loader: '@mdx-js/loader'
             },
@@ -251,6 +245,7 @@ module.exports = function getConfig (env, {
               loader: 'css-loader',
               options: {
                 modules: {
+                  getLocalIdent,
                   localIdentName: LOCAL_IDENT_NAME
                 }
               }
@@ -276,7 +271,7 @@ module.exports = function getConfig (env, {
               }
             }
           ] : [
-            pick(getJsxRule(), ['loader', 'options']),
+            { loader: 'babel-loader' },
             {
               loader: require.resolve('./lib/cssToReactNativeLoader.js')
             },
@@ -299,12 +294,13 @@ module.exports = function getConfig (env, {
               loader: 'css-loader',
               options: {
                 modules: {
+                  getLocalIdent,
                   localIdentName: LOCAL_IDENT_NAME
                 }
               }
             }
           ] : [
-            pick(getJsxRule(), ['loader', 'options']),
+            { loader: 'babel-loader' },
             {
               loader: require.resolve('./lib/cssToReactNativeLoader.js')
             }