@parcel/transformer-react-refresh-wrap 2.0.0-beta.2 → 2.0.0-nightly.1004

package/lib/ReactRefreshWrapTransformer.js

@@ -5,16 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-function _semver() {
-  const data = _interopRequireDefault(require("semver"));
-
-  _semver = function () {
-    return data;
-  };
-
-  return data;
-}
-
 function _path() {
   const data = _interopRequireDefault(require("path"));
 
@@ -25,16 +15,6 @@ function _path() {
   return data;
 }
 
-function _babelAstUtils() {
-  const data = require("@parcel/babel-ast-utils");
-
-  _babelAstUtils = function () {
-    return data;
-  };
-
-  return data;
-}
-
 function _plugin() {
   const data = require("@parcel/plugin");
 
@@ -45,123 +25,51 @@ function _plugin() {
   return data;
 }
 
-function _utils() {
-  const data = require("@parcel/utils");
-
-  _utils = function () {
-    return data;
-  };
-
-  return data;
-}
-
-function _template() {
-  const data = _interopRequireDefault(require("@babel/template"));
-
-  _template = function () {
-    return data;
-  };
-
-  return data;
-}
-
-function t() {
-  const data = _interopRequireWildcard(require("@babel/types"));
-
-  t = function () {
-    return data;
-  };
-
-  return data;
-}
-
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const WRAPPER = _path().default.join(__dirname, 'helpers', 'helpers.js');
-
-const wrapper = _template().default.statements(`
-var helpers = require(%%helper%%);
-var prevRefreshReg = window.$RefreshReg$;
-var prevRefreshSig = window.$RefreshSig$;
-helpers.prelude(module);
-
-try {
-  %%module%%
-  helpers.postlude(module);
-} finally {
-  window.$RefreshReg$ = prevRefreshReg;
-  window.$RefreshSig$ = prevRefreshSig;
-}
-`);
-
 function shouldExclude(asset, options) {
-  return !asset.isSource || !options.hmrOptions || !asset.env.isBrowser() || options.mode !== 'development' || !asset.getDependencies().find(v => v.moduleSpecifier === 'react');
+  return !asset.isSource || !options.hmrOptions || !asset.env.isBrowser() || asset.env.isWorker() || asset.env.isWorklet() || options.mode !== 'development' || !asset.getDependencies().find(v => v.specifier === 'react' || v.specifier === 'react/jsx-runtime' || v.specifier === 'react/jsx-dev-runtime');
 }
 
 var _default = new (_plugin().Transformer)({
-  canReuseAST({
-    ast
-  }) {
-    return ast.type === 'babel' && _semver().default.satisfies(ast.version, '^7.0.0');
-  },
-
-  async parse({
-    asset,
-    options
-  }) {
-    if (shouldExclude(asset, options)) {
-      return null;
-    }
-
-    return (0, _babelAstUtils().parse)({
-      asset,
-      code: await asset.getCode(),
-      options
-    });
-  },
-
   async transform({
     asset,
     options
   }) {
-    let ast = await asset.getAST();
-
-    if (!ast || shouldExclude(asset, options)) {
+    if (shouldExclude(asset, options)) {
       return [asset];
     }
 
-    let wrapperPath = (0, _utils().relativePath)(_path().default.dirname(asset.filePath), WRAPPER);
+    let wrapperPath = `@parcel/transformer-react-refresh-wrap/${_path().default.basename(__dirname)}/helpers/helpers.js`;
+    let code = await asset.getCode();
+    let map = await asset.getMap();
+    let name = `$parcel$ReactRefreshHelpers$${asset.id.slice(-4)}`;
+    code = `var ${name} = require(${JSON.stringify(wrapperPath)});
+var prevRefreshReg = window.$RefreshReg$;
+var prevRefreshSig = window.$RefreshSig$;
+${name}.prelude(module);
 
-    if (!wrapperPath.startsWith('.')) {
-      wrapperPath = './' + wrapperPath;
-    }
+try {
+${code}
+  ${name}.postlude(module);
+} finally {
+  window.$RefreshReg$ = prevRefreshReg;
+  window.$RefreshSig$ = prevRefreshSig;
+}`;
+    asset.setCode(code);
+
+    if (map) {
+      map.offsetLines(1, 6);
+      asset.setMap(map);
+    } // The JSTransformer has already run, do it manually
 
-    ast.program.program.body = wrapper({
-      helper: t().stringLiteral(wrapperPath),
-      module: ast.program.program.body
-    });
-    asset.setAST(ast); // The JSTransformer has already run, do it manually
 
     asset.addDependency({
-      moduleSpecifier: wrapperPath
+      specifier: wrapperPath,
+      specifierType: 'esm',
+      resolveFrom: __filename
     });
     return [asset];
-  },
-
-  generate({
-    asset,
-    ast,
-    options
-  }) {
-    return (0, _babelAstUtils().generate)({
-      asset,
-      ast,
-      options
-    });
   }
 
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@parcel/transformer-react-refresh-wrap",
-  "version": "2.0.0-beta.2",
+  "version": "2.0.0-nightly.1004+47379bf8",
   "license": "MIT",
   "publishConfig": {
     "access": "public"
@@ -17,16 +17,12 @@
   "source": "src/ReactRefreshWrapTransformer.js",
   "engines": {
     "node": ">= 12.0.0",
-    "parcel": "^2.0.0-beta.1"
+    "parcel": "2.0.0-nightly.1002+47379bf8"
   },
   "dependencies": {
-    "@babel/template": "^7.4.0",
-    "@babel/types": "^7.12.13",
-    "@parcel/babel-ast-utils": "2.0.0-beta.2",
-    "@parcel/plugin": "2.0.0-beta.2",
-    "@parcel/utils": "2.0.0-beta.2",
-    "react-refresh": "^0.9.0",
-    "semver": "^5.4.1"
+    "@parcel/plugin": "2.0.0-nightly.1004+47379bf8",
+    "@parcel/utils": "2.0.0-nightly.1004+47379bf8",
+    "react-refresh": "^0.9.0"
   },
-  "gitHead": "a3aa86815e098c90fda72a08d29646ff059ab74d"
+  "gitHead": "47379bf8fabeb2cfe03ade8802d942388b153e5b"
 }

package/src/ReactRefreshWrapTransformer.js

@@ -1,88 +1,67 @@
 // @flow
 
-import type {StringLiteral, Statement} from '@babel/types';
-
-import semver from 'semver';
 import path from 'path';
-import {generate, parse} from '@parcel/babel-ast-utils';
 import {Transformer} from '@parcel/plugin';
-import {relativePath} from '@parcel/utils';
-import template from '@babel/template';
-import * as t from '@babel/types';
-
-const WRAPPER = path.join(__dirname, 'helpers', 'helpers.js');
-
-const wrapper = template.statements<{|
-  helper: StringLiteral,
-  module: Array<Statement>,
-|}>(`
-var helpers = require(%%helper%%);
-var prevRefreshReg = window.$RefreshReg$;
-var prevRefreshSig = window.$RefreshSig$;
-helpers.prelude(module);
-
-try {
-  %%module%%
-  helpers.postlude(module);
-} finally {
-  window.$RefreshReg$ = prevRefreshReg;
-  window.$RefreshSig$ = prevRefreshSig;
-}
-`);
 
 function shouldExclude(asset, options) {
   return (
     !asset.isSource ||
     !options.hmrOptions ||
     !asset.env.isBrowser() ||
+    asset.env.isWorker() ||
+    asset.env.isWorklet() ||
     options.mode !== 'development' ||
-    !asset.getDependencies().find(v => v.moduleSpecifier === 'react')
+    !asset
+      .getDependencies()
+      .find(
+        v =>
+          v.specifier === 'react' ||
+          v.specifier === 'react/jsx-runtime' ||
+          v.specifier === 'react/jsx-dev-runtime',
+      )
   );
 }
 
 export default (new Transformer({
-  canReuseAST({ast}) {
-    return ast.type === 'babel' && semver.satisfies(ast.version, '^7.0.0');
-  },
-
-  async parse({asset, options}) {
+  async transform({asset, options}) {
     if (shouldExclude(asset, options)) {
-      return null;
+      return [asset];
     }
 
-    return parse({
-      asset,
-      code: await asset.getCode(),
-      options,
-    });
-  },
+    let wrapperPath = `@parcel/transformer-react-refresh-wrap/${path.basename(
+      __dirname,
+    )}/helpers/helpers.js`;
 
-  async transform({asset, options}) {
-    let ast = await asset.getAST();
-    if (!ast || shouldExclude(asset, options)) {
-      return [asset];
-    }
+    let code = await asset.getCode();
+    let map = await asset.getMap();
+    let name = `$parcel$ReactRefreshHelpers$${asset.id.slice(-4)}`;
 
-    let wrapperPath = relativePath(path.dirname(asset.filePath), WRAPPER);
-    if (!wrapperPath.startsWith('.')) {
-      wrapperPath = './' + wrapperPath;
-    }
+    code = `var ${name} = require(${JSON.stringify(wrapperPath)});
+var prevRefreshReg = window.$RefreshReg$;
+var prevRefreshSig = window.$RefreshSig$;
+${name}.prelude(module);
 
-    ast.program.program.body = wrapper({
-      helper: t.stringLiteral(wrapperPath),
-      module: ast.program.program.body,
-    });
-    asset.setAST(ast);
+try {
+${code}
+  ${name}.postlude(module);
+} finally {
+  window.$RefreshReg$ = prevRefreshReg;
+  window.$RefreshSig$ = prevRefreshSig;
+}`;
+
+    asset.setCode(code);
+    if (map) {
+      map.offsetLines(1, 6);
+      asset.setMap(map);
+    }
 
     // The JSTransformer has already run, do it manually
     asset.addDependency({
-      moduleSpecifier: wrapperPath,
+      specifier: wrapperPath,
+      specifierType: 'esm',
+      resolveFrom: __filename,
     });
 
     return [asset];
   },
-
-  generate({asset, ast, options}) {
-    return generate({asset, ast, options});
-  },
 }): Transformer);

package/src/helpers/helpers.js

@@ -2,21 +2,21 @@ var Refresh = require('react-refresh/runtime');
 
 function debounce(func, delay) {
   if (process.env.NODE_ENV === 'test') {
-    return function(args) {
+    return function (args) {
       func.call(null, args);
     };
   } else {
     var timeout = undefined;
-    return function(args) {
+    return function (args) {
       clearTimeout(timeout);
-      timeout = setTimeout(function() {
+      timeout = setTimeout(function () {
         timeout = undefined;
         func.call(null, args);
       }, delay);
     };
   }
 }
-var enqueueUpdate = debounce(function() {
+var enqueueUpdate = debounce(function () {
   Refresh.performReactRefresh();
 }, 30);
 
@@ -24,19 +24,19 @@ var enqueueUpdate = debounce(function() {
 // https://github.com/facebook/metro/blob/61de16bd1edd7e738dd0311c89555a644023ab2d/packages/metro/src/lib/polyfills/require.js
 // MIT License - Copyright (c) Facebook, Inc. and its affiliates.
 
-module.exports.prelude = function(module) {
-  window.$RefreshReg$ = function(type, id) {
+module.exports.prelude = function (module) {
+  window.$RefreshReg$ = function (type, id) {
     Refresh.register(type, module.id + ' ' + id);
   };
   window.$RefreshSig$ = Refresh.createSignatureFunctionForTransform;
 };
 
-module.exports.postlude = function(module) {
+module.exports.postlude = function (module) {
   if (isReactRefreshBoundary(module.exports)) {
     registerExportsForReactRefresh(module);
 
     if (module.hot) {
-      module.hot.dispose(function(data) {
+      module.hot.dispose(function (data) {
         if (Refresh.hasUnrecoverableErrors()) {
           window.location.reload();
         }
@@ -44,7 +44,7 @@ module.exports.postlude = function(module) {
         data.prevExports = module.exports;
       });
 
-      module.hot.accept(function(getParents) {
+      module.hot.accept(function (getParents) {
         var prevExports = module.hot.data.prevExports;
         var nextExports = module.exports;
         // Since we just executed the code for it, it's possible