@teambit/react 0.0.658 → 0.0.661

package/dist/webpack/{react-hot-dev-client.js → overlay/webpackHotDevClient.js}

@@ -1,12 +1,12 @@
-"use strict";
+/* eslint-disable */
 
-require("core-js/modules/es.array.iterator.js");
-
-require("core-js/modules/es.promise.js");
-
-require("core-js/modules/web.url.js");
-
-/* eslint-disable promise/catch-or-return */
+/*
+ * this file was copied as is from `react-dev-utils/webpackHotDevClient`
+ * and adjusted for our socket url.
+ *
+ * we use just set process.env.WDS_* with the EnvironmentPlugin or DefinePlugin
+ * once we get react-error-overlay up and running again
+ */
 
 /**
  * Copyright (c) 2015-present, Facebook, Inc.
@@ -14,20 +14,33 @@ require("core-js/modules/web.url.js");
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-const stripAnsi = require('strip-ansi');
+'use strict'; // This alternative WebpackDevServer combines the functionality of:
+// https://github.com/webpack/webpack-dev-server/blob/webpack-1/client/index.js
+// https://github.com/webpack/webpack/blob/webpack-1/hot/dev-server.js
+// It only supports their simplest configuration (hot updates on same server).
+// It makes some opinionated choices on top, like adding a syntax error overlay
+// that looks similar to our console output. The error overlay is inspired by:
+// https://github.com/glenjamin/webpack-hot-middleware
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.promise.js");
+
+require("core-js/modules/web.url.js");
+
+var stripAnsi = require('strip-ansi');
 
-const ErrorOverlay = require('react-error-overlay');
+var url = require('url');
 
-const url = require('url');
+var launchEditorEndpoint = require('./launchEditorEndpoint');
 
-const launchEditorEndpoint = require('./launch-editor-endpoint');
+var formatWebpackMessages = require('./formatWebpackMessages');
 
-const formatWebpackMessages = require('./format-webpack-messages');
+var ErrorOverlay = require('react-error-overlay');
 
 ErrorOverlay.setEditorHandler(function editorHandler(errorLocation) {
   // Keep this sync with errorOverlayMiddleware.js
-  // eslint-disable-next-line @typescript-eslint/no-floating-promises
-  fetch(`${launchEditorEndpoint}?fileName=${window.encodeURIComponent(errorLocation.fileName)}&lineNumber=${window.encodeURIComponent(errorLocation.lineNumber || 1)}&colNumber=${window.encodeURIComponent(errorLocation.colNumber || 1)}`);
+  fetch(launchEditorEndpoint + '?fileName=' + window.encodeURIComponent(errorLocation.fileName) + '&lineNumber=' + window.encodeURIComponent(errorLocation.lineNumber || 1) + '&colNumber=' + window.encodeURIComponent(errorLocation.colNumber || 1));
 }); // We need to keep track of if there has been a runtime error.
 // Essentially, we cannot guarantee application state was not corrupted by the
 // runtime error. To prevent confusing behavior, we forcibly reload the entire
@@ -35,12 +48,11 @@ ErrorOverlay.setEditorHandler(function editorHandler(errorLocation) {
 // change).
 // See https://github.com/facebook/create-react-app/issues/3096
 
-let hadRuntimeError = false;
+var hadRuntimeError = false;
 ErrorOverlay.startReportingRuntimeErrors({
-  onError() {
+  onError: function () {
     hadRuntimeError = true;
   },
-
   filename: '/static/js/bundle.js'
 });
 
@@ -49,42 +61,36 @@ if (module.hot && typeof module.hot.dispose === 'function') {
     // TODO: why do we need this?
     ErrorOverlay.stopReportingRuntimeErrors();
   });
-} // Connect to WebpackDevServer via a socket.
-
+}
 
 const querystring = module.id.substring(module.id.indexOf('?'));
-const urlParams = new URLSearchParams(querystring);
-const connection = new WebSocket(url.format({
+const urlParams = new URLSearchParams(querystring); // Connect to WebpackDevServer via a socket.
+
+var connection = new WebSocket(url.format({
   protocol: window.location.protocol === 'https:' ? 'wss' : 'ws',
   hostname: window.location.hostname,
   port: window.location.port,
-  // Hardcoded in WebpackDevServer
-  pathname: urlParams.get('sockPath') || '/sockjs-node',
-  // pathname: '_hmr/teambit.bad-jokes/extensions/harmony-react',
+  pathname: urlParams.get('sockPath') || '/ws',
   slashes: true
 })); // Unlike WebpackDevServer client, we won't try to reconnect
 // to avoid spamming the console. Disconnect usually happens
 // when developer stops the server.
 
 connection.onclose = function () {
-  // eslint-disable-next-line no-console
   if (typeof console !== 'undefined' && typeof console.info === 'function') {
-    // eslint-disable-next-line no-console
     console.info('The development server has disconnected.\nRefresh the page if necessary.');
   }
 }; // Remember some state related to hot module replacement.
 
 
-let isFirstCompilation = true;
-let mostRecentCompilationHash = null;
-let hasCompileErrors = false;
+var isFirstCompilation = true;
+var mostRecentCompilationHash = null;
+var hasCompileErrors = false;
 
 function clearOutdatedErrors() {
   // Clean up outdated compile errors, if any.
-  // eslint-disable-next-line no-console
   if (typeof console !== 'undefined' && typeof console.clear === 'function') {
     if (hasCompileErrors) {
-      // eslint-disable-next-line no-console
       console.clear();
     }
   }
@@ -93,7 +99,7 @@ function clearOutdatedErrors() {
 
 function handleSuccess() {
   clearOutdatedErrors();
-  const isHotUpdate = !isFirstCompilation;
+  var isHotUpdate = !isFirstCompilation;
   isFirstCompilation = false;
   hasCompileErrors = false; // Attempt to apply hot updates or reload.
 
@@ -109,26 +115,23 @@ function handleSuccess() {
 
 function handleWarnings(warnings) {
   clearOutdatedErrors();
-  const isHotUpdate = !isFirstCompilation;
+  var isHotUpdate = !isFirstCompilation;
   isFirstCompilation = false;
   hasCompileErrors = false;
 
   function printWarnings() {
     // Print warnings to the console.
-    const formatted = formatWebpackMessages({
-      warnings,
+    var formatted = formatWebpackMessages({
+      warnings: warnings,
       errors: []
-    }); // eslint-disable-next-line no-console
+    });
 
     if (typeof console !== 'undefined' && typeof console.warn === 'function') {
-      // eslint-disable-next-line no-plusplus
-      for (let i = 0; i < formatted.warnings.length; i++) {
+      for (var i = 0; i < formatted.warnings.length; i++) {
         if (i === 5) {
-          // eslint-disable-next-line
           console.warn('There were more warnings in other files.\n' + 'You can find a complete log in the terminal.');
           break;
-        } // eslint-disable-next-line no-console
-
+        }
 
         console.warn(stripAnsi(formatted.warnings[i]));
       }
@@ -152,18 +155,15 @@ function handleErrors(errors) {
   isFirstCompilation = false;
   hasCompileErrors = true; // "Massage" webpack messages.
 
-  const formatted = formatWebpackMessages({
-    errors,
+  var formatted = formatWebpackMessages({
+    errors: errors,
     warnings: []
   }); // Only show the first error.
 
   ErrorOverlay.reportBuildError(formatted.errors[0]); // Also log them to the console.
-  // eslint-disable-next-line no-console
 
   if (typeof console !== 'undefined' && typeof console.error === 'function') {
-    // eslint-disable-next-line no-plusplus
-    for (let i = 0; i < formatted.errors.length; i++) {
-      // eslint-disable-next-line no-console
+    for (var i = 0; i < formatted.errors.length; i++) {
       console.error(stripAnsi(formatted.errors[i]));
     }
   } // Do not attempt to reload now.
@@ -185,7 +185,7 @@ function handleAvailableHash(hash) {
 
 
 connection.onmessage = function (e) {
-  const message = JSON.parse(e.data);
+  var message = JSON.parse(e.data);
 
   switch (message.type) {
     case 'hash':
@@ -226,6 +226,17 @@ function isUpdateAvailable() {
 
 function canApplyUpdates() {
   return module.hot.status() === 'idle';
+}
+
+function canAcceptErrors() {
+  // NOTE: This var is injected by Webpack's DefinePlugin, and is a boolean instead of string.
+  const hasReactRefresh = process.env.FAST_REFRESH;
+  const status = module.hot.status(); // React refresh can handle hot-reloading over errors.
+  // However, when hot-reload status is abort or fail,
+  // it indicates the current update cannot be applied safely,
+  // and thus we should bail out to a forced reload for consistency.
+
+  return hasReactRefresh && ['abort', 'fail'].indexOf(status) === -1;
 } // Attempt to update code on the fly, fall back to a hard reload.
 
 
@@ -241,7 +252,14 @@ function tryApplyUpdates(onHotUpdateSuccess) {
   }
 
   function handleApplyUpdates(err, updatedModules) {
-    if (err || !updatedModules || hadRuntimeError) {
+    const haveErrors = err || hadRuntimeError; // When there is no error but updatedModules is unavailable,
+    // it indicates a critical failure in hot-reloading,
+    // e.g. server is not ready to serve new bundle,
+    // and hence we need to do a forced reload.
+
+    const needsForcedReload = !err && !updatedModules;
+
+    if (haveErrors && !canAcceptErrors() || needsForcedReload) {
       window.location.reload();
       return;
     }
@@ -258,7 +276,7 @@ function tryApplyUpdates(onHotUpdateSuccess) {
   } // https://webpack.github.io/docs/hot-module-replacement.html#check
 
 
-  const result = module.hot.check(
+  var result = module.hot.check(
   /* autoApply */
   true, handleApplyUpdates); // // webpack 2 returns a Promise instead of invoking a callback
 
@@ -271,4 +289,4 @@ function tryApplyUpdates(onHotUpdateSuccess) {
   }
 }
 
-//# sourceMappingURL=react-hot-dev-client.js.map
+//# sourceMappingURL=webpackHotDevClient.js.map

package/dist/webpack/overlay/webpackHotDevClient.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["webpackHotDevClient.js"],"names":["stripAnsi","require","url","launchEditorEndpoint","formatWebpackMessages","ErrorOverlay","setEditorHandler","editorHandler","errorLocation","fetch","window","encodeURIComponent","fileName","lineNumber","colNumber","hadRuntimeError","startReportingRuntimeErrors","onError","filename","module","hot","dispose","stopReportingRuntimeErrors","querystring","id","substring","indexOf","urlParams","URLSearchParams","connection","WebSocket","format","protocol","location","hostname","port","pathname","get","slashes","onclose","console","info","isFirstCompilation","mostRecentCompilationHash","hasCompileErrors","clearOutdatedErrors","clear","handleSuccess","isHotUpdate","tryApplyUpdates","onHotUpdateSuccess","tryDismissErrorOverlay","handleWarnings","warnings","printWarnings","formatted","errors","warn","i","length","onSuccessfulHotUpdate","handleErrors","reportBuildError","error","dismissBuildError","handleAvailableHash","hash","onmessage","e","message","JSON","parse","data","type","reload","isUpdateAvailable","__webpack_hash__","canApplyUpdates","status","canAcceptErrors","hasReactRefresh","process","env","FAST_REFRESH","handleApplyUpdates","err","updatedModules","haveErrors","needsForcedReload","result","check","then"],"mappings":"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","sourcesContent":["/* eslint-disable */\n/*\n * this file was copied as is from `react-dev-utils/webpackHotDevClient`\n * and adjusted for our socket url.\n *\n * we use just set process.env.WDS_* with the EnvironmentPlugin or DefinePlugin\n * once we get react-error-overlay up and running again\n */\n\n/**\n * Copyright (c) 2015-present, Facebook, Inc.\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n'use strict';\n\n// This alternative WebpackDevServer combines the functionality of:\n// https://github.com/webpack/webpack-dev-server/blob/webpack-1/client/index.js\n// https://github.com/webpack/webpack/blob/webpack-1/hot/dev-server.js\n\n// It only supports their simplest configuration (hot updates on same server).\n// It makes some opinionated choices on top, like adding a syntax error overlay\n// that looks similar to our console output. The error overlay is inspired by:\n// https://github.com/glenjamin/webpack-hot-middleware\n\nvar stripAnsi = require('strip-ansi');\nvar url = require('url');\nvar launchEditorEndpoint = require('./launchEditorEndpoint');\nvar formatWebpackMessages = require('./formatWebpackMessages');\nvar ErrorOverlay = require('react-error-overlay');\n\nErrorOverlay.setEditorHandler(function editorHandler(errorLocation) {\n  // Keep this sync with errorOverlayMiddleware.js\n  fetch(\n    launchEditorEndpoint +\n      '?fileName=' +\n      window.encodeURIComponent(errorLocation.fileName) +\n      '&lineNumber=' +\n      window.encodeURIComponent(errorLocation.lineNumber || 1) +\n      '&colNumber=' +\n      window.encodeURIComponent(errorLocation.colNumber || 1)\n  );\n});\n\n// We need to keep track of if there has been a runtime error.\n// Essentially, we cannot guarantee application state was not corrupted by the\n// runtime error. To prevent confusing behavior, we forcibly reload the entire\n// application. This is handled below when we are notified of a compile (code\n// change).\n// See https://github.com/facebook/create-react-app/issues/3096\nvar hadRuntimeError = false;\nErrorOverlay.startReportingRuntimeErrors({\n  onError: function () {\n    hadRuntimeError = true;\n  },\n  filename: '/static/js/bundle.js',\n});\n\nif (module.hot && typeof module.hot.dispose === 'function') {\n  module.hot.dispose(function () {\n    // TODO: why do we need this?\n    ErrorOverlay.stopReportingRuntimeErrors();\n  });\n}\n\nconst querystring = module.id.substring(module.id.indexOf('?'));\nconst urlParams = new URLSearchParams(querystring);\n\n// Connect to WebpackDevServer via a socket.\nvar connection = new WebSocket(\n  url.format({\n    protocol: window.location.protocol === 'https:' ? 'wss' : 'ws',\n    hostname: window.location.hostname,\n    port: window.location.port,\n    pathname: urlParams.get('sockPath') || '/ws',\n    slashes: true,\n  })\n);\n\n// Unlike WebpackDevServer client, we won't try to reconnect\n// to avoid spamming the console. Disconnect usually happens\n// when developer stops the server.\nconnection.onclose = function () {\n  if (typeof console !== 'undefined' && typeof console.info === 'function') {\n    console.info('The development server has disconnected.\\nRefresh the page if necessary.');\n  }\n};\n\n// Remember some state related to hot module replacement.\nvar isFirstCompilation = true;\nvar mostRecentCompilationHash = null;\nvar hasCompileErrors = false;\n\nfunction clearOutdatedErrors() {\n  // Clean up outdated compile errors, if any.\n  if (typeof console !== 'undefined' && typeof console.clear === 'function') {\n    if (hasCompileErrors) {\n      console.clear();\n    }\n  }\n}\n\n// Successful compilation.\nfunction handleSuccess() {\n  clearOutdatedErrors();\n\n  var isHotUpdate = !isFirstCompilation;\n  isFirstCompilation = false;\n  hasCompileErrors = false;\n\n  // Attempt to apply hot updates or reload.\n  if (isHotUpdate) {\n    tryApplyUpdates(function onHotUpdateSuccess() {\n      // Only dismiss it when we're sure it's a hot update.\n      // Otherwise it would flicker right before the reload.\n      tryDismissErrorOverlay();\n    });\n  }\n}\n\n// Compilation with warnings (e.g. ESLint).\nfunction handleWarnings(warnings) {\n  clearOutdatedErrors();\n\n  var isHotUpdate = !isFirstCompilation;\n  isFirstCompilation = false;\n  hasCompileErrors = false;\n\n  function printWarnings() {\n    // Print warnings to the console.\n    var formatted = formatWebpackMessages({\n      warnings: warnings,\n      errors: [],\n    });\n\n    if (typeof console !== 'undefined' && typeof console.warn === 'function') {\n      for (var i = 0; i < formatted.warnings.length; i++) {\n        if (i === 5) {\n          console.warn('There were more warnings in other files.\\n' + 'You can find a complete log in the terminal.');\n          break;\n        }\n        console.warn(stripAnsi(formatted.warnings[i]));\n      }\n    }\n  }\n\n  printWarnings();\n\n  // Attempt to apply hot updates or reload.\n  if (isHotUpdate) {\n    tryApplyUpdates(function onSuccessfulHotUpdate() {\n      // Only dismiss it when we're sure it's a hot update.\n      // Otherwise it would flicker right before the reload.\n      tryDismissErrorOverlay();\n    });\n  }\n}\n\n// Compilation with errors (e.g. syntax error or missing modules).\nfunction handleErrors(errors) {\n  clearOutdatedErrors();\n\n  isFirstCompilation = false;\n  hasCompileErrors = true;\n\n  // \"Massage\" webpack messages.\n  var formatted = formatWebpackMessages({\n    errors: errors,\n    warnings: [],\n  });\n\n  // Only show the first error.\n  ErrorOverlay.reportBuildError(formatted.errors[0]);\n\n  // Also log them to the console.\n  if (typeof console !== 'undefined' && typeof console.error === 'function') {\n    for (var i = 0; i < formatted.errors.length; i++) {\n      console.error(stripAnsi(formatted.errors[i]));\n    }\n  }\n\n  // Do not attempt to reload now.\n  // We will reload on next success instead.\n}\n\nfunction tryDismissErrorOverlay() {\n  if (!hasCompileErrors) {\n    ErrorOverlay.dismissBuildError();\n  }\n}\n\n// There is a newer version of the code available.\nfunction handleAvailableHash(hash) {\n  // Update last known compilation hash.\n  mostRecentCompilationHash = hash;\n}\n\n// Handle messages from the server.\nconnection.onmessage = function (e) {\n  var message = JSON.parse(e.data);\n  switch (message.type) {\n    case 'hash':\n      handleAvailableHash(message.data);\n      break;\n    case 'still-ok':\n    case 'ok':\n      handleSuccess();\n      break;\n    case 'content-changed':\n      // Triggered when a file from `contentBase` changed.\n      window.location.reload();\n      break;\n    case 'warnings':\n      handleWarnings(message.data);\n      break;\n    case 'errors':\n      handleErrors(message.data);\n      break;\n    default:\n    // Do nothing.\n  }\n};\n\n// Is there a newer version of this code available?\nfunction isUpdateAvailable() {\n  /* globals __webpack_hash__ */\n  // __webpack_hash__ is the hash of the current compilation.\n  // It's a global variable injected by webpack.\n  return mostRecentCompilationHash !== __webpack_hash__;\n}\n\n// webpack disallows updates in other states.\nfunction canApplyUpdates() {\n  return module.hot.status() === 'idle';\n}\n\nfunction canAcceptErrors() {\n  // NOTE: This var is injected by Webpack's DefinePlugin, and is a boolean instead of string.\n  const hasReactRefresh = process.env.FAST_REFRESH;\n\n  const status = module.hot.status();\n  // React refresh can handle hot-reloading over errors.\n  // However, when hot-reload status is abort or fail,\n  // it indicates the current update cannot be applied safely,\n  // and thus we should bail out to a forced reload for consistency.\n  return hasReactRefresh && ['abort', 'fail'].indexOf(status) === -1;\n}\n\n// Attempt to update code on the fly, fall back to a hard reload.\nfunction tryApplyUpdates(onHotUpdateSuccess) {\n  if (!module.hot) {\n    // HotModuleReplacementPlugin is not in webpack configuration.\n    window.location.reload();\n    return;\n  }\n\n  if (!isUpdateAvailable() || !canApplyUpdates()) {\n    return;\n  }\n\n  function handleApplyUpdates(err, updatedModules) {\n    const haveErrors = err || hadRuntimeError;\n    // When there is no error but updatedModules is unavailable,\n    // it indicates a critical failure in hot-reloading,\n    // e.g. server is not ready to serve new bundle,\n    // and hence we need to do a forced reload.\n    const needsForcedReload = !err && !updatedModules;\n    if ((haveErrors && !canAcceptErrors()) || needsForcedReload) {\n      window.location.reload();\n      return;\n    }\n\n    if (typeof onHotUpdateSuccess === 'function') {\n      // Maybe we want to do something.\n      onHotUpdateSuccess();\n    }\n\n    if (isUpdateAvailable()) {\n      // While we were updating, there was a new update! Do it again.\n      tryApplyUpdates();\n    }\n  }\n\n  // https://webpack.github.io/docs/hot-module-replacement.html#check\n  var result = module.hot.check(/* autoApply */ true, handleApplyUpdates);\n\n  // // webpack 2 returns a Promise instead of invoking a callback\n  if (result && result.then) {\n    result.then(\n      function (updatedModules) {\n        handleApplyUpdates(null, updatedModules);\n      },\n      function (err) {\n        handleApplyUpdates(err, null);\n      }\n    );\n  }\n}\n"]}

package/dist/webpack/webpack.config.component.dev.js

@@ -108,10 +108,9 @@ function _default(workDir, envId) {
     new (_reactRefreshWebpackPlugin().default)({
       overlay: {
         sockPath: `_hmr/${envId}`,
-        // TODO: check why webpackHotDevClient and react-error-overlay are not responding for runtime
-        // errors
-        entry: require.resolve('./react-hot-dev-client'),
-        module: require.resolve('./refresh')
+        // TODO - react-error-overlay not showing runtime errors - https://github.com/teambit/bit/issues/5452
+        entry: require.resolve('./overlay/webpackHotDevClient'),
+        module: require.resolve('./overlay/refreshOverlayInterop')
       },
       // we use '@pmmmwh/react-refresh-webpack-plugin/loader' directly where relevant.
       // FYI, original defaults of the plugin are:

package/dist/webpack/webpack.config.component.dev.js.map

@@ -1 +1 @@
-{"version":3,"sources":["webpack.config.component.dev.ts"],"names":["matchNothingRegex","workDir","envId","module","rules","test","enforce","include","path","join","descriptionData","componentId","value","use","require","resolve","ComponentID","isValidObject","loader","options","babelrc","configFile","plugins","compact","minified","presets","ReactRefreshWebpackPlugin","overlay","sockPath","entry"],"mappings":"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","sourcesContent":["import path from 'path';\nimport { Configuration } from 'webpack';\nimport { ComponentID } from '@teambit/component-id';\n// Make sure the bit-react-transformer is a dependency\n// TODO: remove it once we can set policy from component to component then set it via the component.json\nimport '@teambit/react.babel.bit-react-transformer';\nimport ReactRefreshWebpackPlugin from '@pmmmwh/react-refresh-webpack-plugin';\n\nconst matchNothingRegex = 'a^';\n\n// This is the production and development configuration.\n// It is focused on developer experience, fast rebuilds, and a minimal bundle.\n// eslint-disable-next-line complexity\n// export default function (workDir: string, envId: string): Configuration {\nexport default function (workDir: string, envId: string): Configuration {\n  return {\n    module: {\n      rules: [\n        {\n          test: /\\.js$/,\n          enforce: 'pre',\n          // limit loader to files in the current project,\n          // to skip any files linked from other projects (like Bit itself)\n          include: path.join(workDir, 'node_modules'),\n          // only apply to packages with componentId in their package.json (ie. bit components)\n          descriptionData: { componentId: (value) => !!value },\n          use: [require.resolve('source-map-loader')],\n        },\n        {\n          test: /\\.js$/,\n          // limit loader to files in the current project,\n          // to skip any files linked from other projects (like Bit itself)\n          include: path.join(workDir, 'node_modules'),\n          // only apply to packages with componentId in their package.json (ie. bit components)\n          descriptionData: { componentId: ComponentID.isValidObject },\n          use: [\n            require.resolve('@pmmmwh/react-refresh-webpack-plugin/loader'),\n            {\n              loader: require.resolve('babel-loader'),\n              options: {\n                babelrc: false,\n                configFile: false,\n                plugins: [\n                  require.resolve('react-refresh/babel'),\n                  // for component highlighting in preview.\n                  [require.resolve('@teambit/react.babel.bit-react-transformer')],\n                ],\n                // turn off all optimizations (only slow down for node_modules)\n                compact: false,\n                minified: false,\n              },\n            },\n          ],\n        },\n        // MDX support (move to the mdx aspect and extend from there)\n        {\n          test: /\\.mdx?$/,\n          // to skip any files linked from other projects (like Bit itself)\n          include: path.join(workDir, 'node_modules'),\n          // only apply to packages with componentId in their package.json (ie. bit components)\n          descriptionData: { componentId: (value) => !!value },\n          use: [\n            require.resolve('@pmmmwh/react-refresh-webpack-plugin/loader'),\n            {\n              loader: require.resolve('babel-loader'),\n              options: {\n                babelrc: false,\n                configFile: false,\n                presets: [require.resolve('@babel/preset-react'), require.resolve('@babel/preset-env')],\n                plugins: [require.resolve('react-refresh/babel')],\n              },\n            },\n            {\n              loader: require.resolve('@teambit/mdx.modules.mdx-loader'),\n            },\n          ],\n        },\n      ],\n    },\n    plugins: [\n      // No need here as we have `hot: true` in the dev server\n      // new webpack.HotModuleReplacementPlugin({}),\n      new ReactRefreshWebpackPlugin({\n        overlay: {\n          sockPath: `_hmr/${envId}`,\n          // TODO: check why webpackHotDevClient and react-error-overlay are not responding for runtime\n          // errors\n          entry: require.resolve('./react-hot-dev-client'),\n          module: require.resolve('./refresh'),\n        },\n\n        // we use '@pmmmwh/react-refresh-webpack-plugin/loader' directly where relevant.\n        // FYI, original defaults of the plugin are:\n        // include: /\\.([cm]js|[jt]sx?|flow)$/i, exclude: /node_modules/,\n        include: matchNothingRegex,\n      }),\n    ],\n  };\n}\n"]}
+{"version":3,"sources":["webpack.config.component.dev.ts"],"names":["matchNothingRegex","workDir","envId","module","rules","test","enforce","include","path","join","descriptionData","componentId","value","use","require","resolve","ComponentID","isValidObject","loader","options","babelrc","configFile","plugins","compact","minified","presets","ReactRefreshWebpackPlugin","overlay","sockPath","entry"],"mappings":";;;;;;;;;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAEA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAGA;;AACA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAHA;AACA;AAIA,MAAMA,iBAAiB,GAAG,IAA1B,C,CAEA;AACA;AACA;AACA;;AACe,kBAAUC,OAAV,EAA2BC,KAA3B,EAAyD;AACtE,SAAO;AACLC,IAAAA,MAAM,EAAE;AACNC,MAAAA,KAAK,EAAE,CACL;AACEC,QAAAA,IAAI,EAAE,OADR;AAEEC,QAAAA,OAAO,EAAE,KAFX;AAGE;AACA;AACAC,QAAAA,OAAO,EAAEC,gBAAKC,IAAL,CAAUR,OAAV,EAAmB,cAAnB,CALX;AAME;AACAS,QAAAA,eAAe,EAAE;AAAEC,UAAAA,WAAW,EAAGC,KAAD,IAAW,CAAC,CAACA;AAA5B,SAPnB;AAQEC,QAAAA,GAAG,EAAE,CAACC,OAAO,CAACC,OAAR,CAAgB,mBAAhB,CAAD;AARP,OADK,EAWL;AACEV,QAAAA,IAAI,EAAE,OADR;AAEE;AACA;AACAE,QAAAA,OAAO,EAAEC,gBAAKC,IAAL,CAAUR,OAAV,EAAmB,cAAnB,CAJX;AAKE;AACAS,QAAAA,eAAe,EAAE;AAAEC,UAAAA,WAAW,EAAEK,2BAAYC;AAA3B,SANnB;AAOEJ,QAAAA,GAAG,EAAE,CACHC,OAAO,CAACC,OAAR,CAAgB,6CAAhB,CADG,EAEH;AACEG,UAAAA,MAAM,EAAEJ,OAAO,CAACC,OAAR,CAAgB,cAAhB,CADV;AAEEI,UAAAA,OAAO,EAAE;AACPC,YAAAA,OAAO,EAAE,KADF;AAEPC,YAAAA,UAAU,EAAE,KAFL;AAGPC,YAAAA,OAAO,EAAE,CACPR,OAAO,CAACC,OAAR,CAAgB,qBAAhB,CADO,EAEP;AACA,aAACD,OAAO,CAACC,OAAR,CAAgB,4CAAhB,CAAD,CAHO,CAHF;AAQP;AACAQ,YAAAA,OAAO,EAAE,KATF;AAUPC,YAAAA,QAAQ,EAAE;AAVH;AAFX,SAFG;AAPP,OAXK,EAqCL;AACA;AACEnB,QAAAA,IAAI,EAAE,SADR;AAEE;AACAE,QAAAA,OAAO,EAAEC,gBAAKC,IAAL,CAAUR,OAAV,EAAmB,cAAnB,CAHX;AAIE;AACAS,QAAAA,eAAe,EAAE;AAAEC,UAAAA,WAAW,EAAGC,KAAD,IAAW,CAAC,CAACA;AAA5B,SALnB;AAMEC,QAAAA,GAAG,EAAE,CACHC,OAAO,CAACC,OAAR,CAAgB,6CAAhB,CADG,EAEH;AACEG,UAAAA,MAAM,EAAEJ,OAAO,CAACC,OAAR,CAAgB,cAAhB,CADV;AAEEI,UAAAA,OAAO,EAAE;AACPC,YAAAA,OAAO,EAAE,KADF;AAEPC,YAAAA,UAAU,EAAE,KAFL;AAGPI,YAAAA,OAAO,EAAE,CAACX,OAAO,CAACC,OAAR,CAAgB,qBAAhB,CAAD,EAAyCD,OAAO,CAACC,OAAR,CAAgB,mBAAhB,CAAzC,CAHF;AAIPO,YAAAA,OAAO,EAAE,CAACR,OAAO,CAACC,OAAR,CAAgB,qBAAhB,CAAD;AAJF;AAFX,SAFG,EAWH;AACEG,UAAAA,MAAM,EAAEJ,OAAO,CAACC,OAAR,CAAgB,iCAAhB;AADV,SAXG;AANP,OAtCK;AADD,KADH;AAgELO,IAAAA,OAAO,EAAE,CACP;AACA;AACA,SAAII,oCAAJ,EAA8B;AAC5BC,MAAAA,OAAO,EAAE;AACPC,QAAAA,QAAQ,EAAG,QAAO1B,KAAM,EADjB;AAEP;AACA2B,QAAAA,KAAK,EAAEf,OAAO,CAACC,OAAR,CAAgB,+BAAhB,CAHA;AAIPZ,QAAAA,MAAM,EAAEW,OAAO,CAACC,OAAR,CAAgB,iCAAhB;AAJD,OADmB;AAQ5B;AACA;AACA;AACAR,MAAAA,OAAO,EAAEP;AAXmB,KAA9B,CAHO;AAhEJ,GAAP;AAkFD","sourcesContent":["import path from 'path';\nimport { Configuration } from 'webpack';\nimport { ComponentID } from '@teambit/component-id';\n// Make sure the bit-react-transformer is a dependency\n// TODO: remove it once we can set policy from component to component then set it via the component.json\nimport '@teambit/react.babel.bit-react-transformer';\nimport ReactRefreshWebpackPlugin from '@pmmmwh/react-refresh-webpack-plugin';\n\nconst matchNothingRegex = 'a^';\n\n// This is the production and development configuration.\n// It is focused on developer experience, fast rebuilds, and a minimal bundle.\n// eslint-disable-next-line complexity\n// export default function (workDir: string, envId: string): Configuration {\nexport default function (workDir: string, envId: string): Configuration {\n  return {\n    module: {\n      rules: [\n        {\n          test: /\\.js$/,\n          enforce: 'pre',\n          // limit loader to files in the current project,\n          // to skip any files linked from other projects (like Bit itself)\n          include: path.join(workDir, 'node_modules'),\n          // only apply to packages with componentId in their package.json (ie. bit components)\n          descriptionData: { componentId: (value) => !!value },\n          use: [require.resolve('source-map-loader')],\n        },\n        {\n          test: /\\.js$/,\n          // limit loader to files in the current project,\n          // to skip any files linked from other projects (like Bit itself)\n          include: path.join(workDir, 'node_modules'),\n          // only apply to packages with componentId in their package.json (ie. bit components)\n          descriptionData: { componentId: ComponentID.isValidObject },\n          use: [\n            require.resolve('@pmmmwh/react-refresh-webpack-plugin/loader'),\n            {\n              loader: require.resolve('babel-loader'),\n              options: {\n                babelrc: false,\n                configFile: false,\n                plugins: [\n                  require.resolve('react-refresh/babel'),\n                  // for component highlighting in preview.\n                  [require.resolve('@teambit/react.babel.bit-react-transformer')],\n                ],\n                // turn off all optimizations (only slow down for node_modules)\n                compact: false,\n                minified: false,\n              },\n            },\n          ],\n        },\n        // MDX support (move to the mdx aspect and extend from there)\n        {\n          test: /\\.mdx?$/,\n          // to skip any files linked from other projects (like Bit itself)\n          include: path.join(workDir, 'node_modules'),\n          // only apply to packages with componentId in their package.json (ie. bit components)\n          descriptionData: { componentId: (value) => !!value },\n          use: [\n            require.resolve('@pmmmwh/react-refresh-webpack-plugin/loader'),\n            {\n              loader: require.resolve('babel-loader'),\n              options: {\n                babelrc: false,\n                configFile: false,\n                presets: [require.resolve('@babel/preset-react'), require.resolve('@babel/preset-env')],\n                plugins: [require.resolve('react-refresh/babel')],\n              },\n            },\n            {\n              loader: require.resolve('@teambit/mdx.modules.mdx-loader'),\n            },\n          ],\n        },\n      ],\n    },\n    plugins: [\n      // No need here as we have `hot: true` in the dev server\n      // new webpack.HotModuleReplacementPlugin({}),\n      new ReactRefreshWebpackPlugin({\n        overlay: {\n          sockPath: `_hmr/${envId}`,\n          // TODO - react-error-overlay not showing runtime errors - https://github.com/teambit/bit/issues/5452\n          entry: require.resolve('./overlay/webpackHotDevClient'),\n          module: require.resolve('./overlay/refreshOverlayInterop'),\n        },\n\n        // we use '@pmmmwh/react-refresh-webpack-plugin/loader' directly where relevant.\n        // FYI, original defaults of the plugin are:\n        // include: /\\.([cm]js|[jt]sx?|flow)$/i, exclude: /node_modules/,\n        include: matchNothingRegex,\n      }),\n    ],\n  };\n}\n"]}

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@teambit/react",
-  "version": "0.0.658",
+  "version": "0.0.661",
   "homepage": "https://bit.dev/teambit/react/react",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.react",
     "name": "react",
-    "version": "0.0.658"
+    "version": "0.0.661"
   },
   "dependencies": {
     "react-error-boundary": "^3.0.0",
@@ -32,8 +32,6 @@
     "@babel/preset-typescript": "7.12.17",
     "expose-loader": "3.1.0",
     "postcss-preset-env": "6.7.0",
-    "react-error-overlay": "6.0.9",
-    "strip-ansi": "6.0.0",
     "css-minimizer-webpack-plugin": "3.0.2",
     "terser-webpack-plugin": "5.2.0",
     "webpack": "5.51.1",
@@ -41,7 +39,9 @@
     "mini-css-extract-plugin": "2.2.2",
     "react-dev-utils": "11.0.4",
     "style-loader": "^2.0.0",
-    "@pmmmwh/react-refresh-webpack-plugin": "0.5.1",
+    "@pmmmwh/react-refresh-webpack-plugin": "0.5.4",
+    "react-error-overlay": "6.0.10",
+    "strip-ansi": "6.0.0",
     "@dreysolano/prerender-spa-plugin": "1.0.3",
     "comment-json": "3.0.3",
     "react-refresh": "0.10.0",
@@ -79,39 +79,39 @@
     "@teambit/react.instructions.react.adding-compositions": "0.0.6",
     "@teambit/react.instructions.react.adding-tests": "0.0.6",
     "@teambit/design.ui.pages.standalone-not-found-page": "0.0.355",
-    "@teambit/preview": "0.0.658",
+    "@teambit/preview": "0.0.661",
     "@teambit/react.ui.error-fallback": "0.0.110",
     "@teambit/react.ui.loader-fallback": "0.0.89",
     "@teambit/compositions.ui.hooks.use-composition": "0.0.163",
     "@teambit/design.ui.input.option-button": "0.0.26",
     "@teambit/design.ui.tooltip": "0.0.352",
-    "@teambit/builder": "0.0.658",
-    "@teambit/bundler": "0.0.658",
-    "@teambit/compiler": "0.0.658",
+    "@teambit/builder": "0.0.661",
+    "@teambit/bundler": "0.0.661",
+    "@teambit/compiler": "0.0.661",
     "@teambit/component.modules.component-url": "0.0.123",
-    "@teambit/component": "0.0.658",
-    "@teambit/envs": "0.0.658",
-    "@teambit/eslint": "0.0.658",
-    "@teambit/formatter": "0.0.209",
-    "@teambit/jest": "0.0.658",
-    "@teambit/linter": "0.0.658",
-    "@teambit/pkg": "0.0.658",
-    "@teambit/prettier": "0.0.209",
+    "@teambit/component": "0.0.661",
+    "@teambit/envs": "0.0.661",
+    "@teambit/eslint": "0.0.661",
+    "@teambit/formatter": "0.0.212",
+    "@teambit/jest": "0.0.661",
+    "@teambit/linter": "0.0.661",
+    "@teambit/pkg": "0.0.661",
+    "@teambit/prettier": "0.0.212",
     "@teambit/react.ui.highlighter.component-metadata.bit-component-meta": "0.0.21",
-    "@teambit/schema": "0.0.658",
-    "@teambit/tester": "0.0.658",
-    "@teambit/typescript": "0.0.658",
-    "@teambit/webpack": "0.0.658",
-    "@teambit/workspace": "0.0.658",
-    "@teambit/application": "0.0.300",
-    "@teambit/cli": "0.0.448",
-    "@teambit/dependency-resolver": "0.0.658",
-    "@teambit/generator": "0.0.658",
-    "@teambit/graphql": "0.0.658",
+    "@teambit/schema": "0.0.661",
+    "@teambit/tester": "0.0.661",
+    "@teambit/typescript": "0.0.661",
+    "@teambit/webpack": "0.0.661",
+    "@teambit/workspace": "0.0.661",
+    "@teambit/application": "0.0.303",
+    "@teambit/cli": "0.0.449",
+    "@teambit/dependency-resolver": "0.0.661",
+    "@teambit/generator": "0.0.661",
+    "@teambit/graphql": "0.0.661",
     "@teambit/react.ui.highlighter-provider": "0.0.184",
-    "@teambit/compositions": "0.0.658",
-    "@teambit/ui": "0.0.658",
-    "@teambit/react.eslint-config-bit-react": "0.0.525",
+    "@teambit/compositions": "0.0.661",
+    "@teambit/ui": "0.0.661",
+    "@teambit/react.eslint-config-bit-react": "0.0.526",
     "@teambit/webpack.modules.generate-expose-loaders": "0.0.3",
     "@teambit/webpack.modules.generate-externals": "0.0.3",
     "@teambit/webpack.modules.config-mutator": "0.0.137",
@@ -121,7 +121,7 @@
     "@teambit/webpack.modules.style-regexps": "0.0.132",
     "@teambit/component-id": "0.0.401",
     "@teambit/toolbox.network.get-port": "0.0.113",
-    "@teambit/config": "0.0.461"
+    "@teambit/config": "0.0.462"
   },
   "devDependencies": {
     "@types/react": "^17.0.8",
@@ -131,6 +131,7 @@
     "@types/lodash.flatten": "4.4.6",
     "@types/webpack": "5.28.0",
     "@types/mini-css-extract-plugin": "2.2.0",
+    "@types/react-dev-utils": "9.0.10",
     "@types/postcss-normalize": "9.0.1",
     "@types/node": "12.20.4",
     "@types/mocha": "9.1.0",
@@ -139,7 +140,7 @@
     "@teambit/react.aspect-docs.react": "0.0.132"
   },
   "peerDependencies": {
-    "@teambit/legacy": "1.0.227",
+    "@teambit/legacy": "1.0.228",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },
@@ -201,7 +202,7 @@
         "@types/jest": "^26.0.0"
       },
       "peerDependencies": {
-        "@teambit/legacy": "1.0.227",
+        "@teambit/legacy": "1.0.228",
         "react-dom": "^16.8.0 || ^17.0.0",
         "react": "^16.8.0 || ^17.0.0"
       }

package/webpack/{format-webpack-messages.js → overlay/formatWebpackMessages.js}

@@ -1,9 +1,13 @@
+/* eslint-disable */
 /**
  * Copyright (c) 2015-present, Facebook, Inc.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
+
+'use strict';
+
 const friendlySyntaxErrorLabel = 'Syntax error:';
 
 function isLikelyASyntaxError(message) {
@@ -11,9 +15,20 @@ function isLikelyASyntaxError(message) {
 }
 
 // Cleans up webpack error messages.
-function formatMessage(error) {
-  let message = error.message;
-  let lines = message.split('\n');
+function formatMessage(message) {
+  let lines = [];
+
+  if (typeof message === 'string') {
+    lines = message.split('\n');
+  } else if ('message' in message) {
+    lines = message['message'].split('\n');
+  } else if (Array.isArray(message)) {
+    message.forEach((message) => {
+      if ('message' in message) {
+        lines = message['message'].split('\n');
+      }
+    });
+  }
 
   // Strip webpack-added headers off errors/warnings
   // https://github.com/webpack/webpack/blob/master/lib/ModuleError.js
@@ -64,9 +79,9 @@ function formatMessage(error) {
   }
 
   // Add helpful message for users trying to use Sass for the first time
-  if (lines[1] && lines[1].match(/Cannot find module.+node-sass/)) {
-    lines[1] = 'To import Sass files, you first need to install node-sass.\n';
-    lines[1] += 'Run `npm install node-sass` or `yarn add node-sass` inside your workspace.';
+  if (lines[1] && lines[1].match(/Cannot find module.+sass/)) {
+    lines[1] = 'To import Sass files, you first need to install sass.\n';
+    lines[1] += 'Run `bit install sass` inside your workspace.';
   }
 
   message = lines.join('\n');

package/webpack/{launch-editor-endpoint.js → overlay/launchEditorEndpoint.js}

@@ -1,8 +1,11 @@
+/* eslint-disable */
 /**
  * Copyright (c) 2015-present, Facebook, Inc.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
+'use strict';
+
 // TODO: we might want to make this injectable to support DEV-time non-root URLs.
 module.exports = '/__open-stack-frame-in-editor';

package/webpack/{refresh.js → overlay/refreshOverlayInterop.js}

@@ -1,3 +1,6 @@
+/* eslint-disable */
+/** this file was copied as is from react-dev-utils/refreshOverlayInterop */
+
 // @remove-on-eject-begin
 /**
  * Copyright (c) 2015-present, Facebook, Inc.