Unexpected token with webpack after upgrade to 2.0.0

[bz2]

I have a project with a mostly working refresh setup using prefesh and webpack and hooks, and a test upgrade to the last version no longer functions. Instead throws a parse error during build.

Changes made

In package.json:

-    "@prefresh/webpack": "^1.0.2",
+    "@prefresh/babel-plugin": "^0.2.0",
+    "@prefresh/webpack": "^2.0.0",
...
-    "react-refresh": "^0.8.3",

In babel.config.js:

...
   const plugins = [
     '@babel/plugin-proposal-nullish-coalescing-operator',
     '@babel/plugin-proposal-optional-chaining',
     '@babel/plugin-transform-react-jsx',
     ['@babel/plugin-transform-runtime', {useESModules: true}],
   ];
-  if (api.env('development-watch')) {
+  if (api.env('development')) {
     /* Add plugin for @prefresh/webpack hook support */
-    plugins.push('react-refresh/babel');
+    plugins.push('@prefresh/babel-plugin');
   }
  const presets = [
    '@babel/preset-env',
    ['@babel/preset-typescript', {
      'allExtensions': true,
      'isTSX': true,
    }],
  ];
...

(note the env change is to stop the complaint about "React Refresh Babel transform should only be enabled in development environment." which should probably say "Preact Refresh Babel)

No meaningful changes to webpack.config.babel.js but does have some other plugins as well as new PreactRefreshPlugin().

Error message

  ERROR in ./src/context/assets.tsx 37:10
  Module parse failed: Unexpected token (37:10)
  File was processed with these loaders:
   * ./node_modules/@prefresh/webpack/src/loader/index.js
   * ./node_modules/babel-loader/lib/index.js
  You may need an additional loader to handle the result of these loaders.
  | }
  | export const AssetsContext = Object.assign(createContext._16jwu9b$AssetsContext || (createContext._16jwu9b$AssetsContext = createContext(), {
  >   __: ({} as Assets)
  | }));
  | 
   @ ./src/modeledit/mapeditor/core.js 11:0-74 332:31-50 345:7-20
   @ ./src/modeledit/app.js
   @ ./src/entry/oldedit.js
   @ multi ./node_modules/@prefresh/core/src/index.js ./src/entry/oldedit.js

Might be the tsx, or the context, or something else that's causing the unhappiness?

[JoviDeCroock]

Could you show the original code? This seems like an issue in the transform

[bz2]

Looks like this reduced version fails:

import {createContext} from 'preact';

export interface Assets {}

export function assetsFromModelData(mapData: unknown): Assets {
  return {};
}

export const AssetsContext = createContext({} as Assets);

And this does not:

import {createContext} from 'preact';

export interface Assets {}

export function assetsFromModelData(mapData: unknown): Assets {
  return {};
}

export const AssetsContext = createContext({});

[JoviDeCroock]

@bz2 Got a fix lined up for you

[bz2]

@JoviDeCroock Thanks for having a look! I tried hacking you change in locally, which got babel through compiling but then lead to a complaint from createElement() at runtime, so will have another try with your final version. It would be fine to run all this with any tsnodes ignored wholesale I suspect.

[JoviDeCroock]

Found another potential bug so I'll be releasing 0.2.2 in a bit

[bz2]

Yup, unfortunately looks like I reduced the real code down a bit to far, the actual line is:

export const AssetsContext = createContext<Assets>({} as Assets);

So, the AST also has a TSTypeParameterInstantiation node at higher up, which still upsets things, just at runtime somehow.

[bz2]

Looks like it should be sensible to leverage @babel/helper-skip-transparent-expression-wrappers as the code added in babel/babel#11404 looks similar to yours, but may not be easy to adjust?

[JoviDeCroock]

It doesn't seem to give me any exceptions since these are stripped out by @babel/typescript normally. Tried in my own example and no issues.

[bz2]

I may be wrong on the cause, will make a proper standalone reproduction.

[bz2]

@JoviDeCroock I can confirm that 0.2.2 works for me.

[JoviDeCroock]

@bz2 Awesome, very glad to hear that! Btw you can pass a second argument to the babel plugin called skipEnvCheck to avoid the issue with having to change your env names.