Skip to content

5.0.0

Compare
Choose a tag to compare
@martpie martpie released this 26 Nov 12:41
· 221 commits to master since this release

Hello there, next-transpile-modules@5 is here! There are no API changes, but some internal changes introduced breaking behavioral changes.

Make sure you understand the changes before upgrading!

The breaking changes are indicated by the ⚠️ icon.

⚠️ New resolution strategy

next-transpile-modules used to use Regexes to make Webpack check if a file should be transpiled by Babel or not. This is not the case anymore.

The plugin now uses require.resolve (enhanced-resolve actually) to check which paths should be transpiled or not.

Ok, what does that mean for you as a developer?

  • Ensure all your transpiled modules have a main field
    • If you think it does not make sense, still, have one! You can also create an empty index.js at the root and point "main" to it
    • This main field can point to anything that is a module, that means you can point to a TS file: "main": "src/index.ts"
  • If you are making use of the undocumented custom regex support (like require('next-transpile-modules')(['@org/(.*)'], this won't work anymore. There is no plan of re-adding this "feature" right now.
  • next-transpile-modules will use the dirname of the modules resolve in your main field as "the folder that needs to be transpiled". Meaning that if you have the following structure:
styleguide/
├── components/
├── utils/
└── package.json

and your main field is components/index.js, utils/ won't get transpiled.

After that, you should be good to go!

Support for pnpm and Yarn "Berry"'s PnP

Tests were added to make sure everything works with pnpm. Yarn Berry should now also work out of the box.

A few words about Yarn's PnP:

  • It was an absolute pain to support. Yes, I really want you to know that. 😅
  • HMR may not work (well, your modules are zip files)
  • I will need your feedback and help to improve things there: if you need to have a fix fast, it's better if you submit a PR ;)

Debug Mode

A debug mode was added in case you're interested in checking if the correct files get transpiled. Be careful it's verbose!

const withTM = require('next-transpile-modules')(['somemodule', 'and-another'], { debug: true });

Screen Shot 2020-11-20 at 16 46 51

Webpack 5 improvements (experimental)

  • HMR should now work
  • But HMR is not yet fully optimized, due to some Webpack cache configurations that are extremely hard to tweak

Some well deserved thanks

I would like to thank everyone who helped me with this release, let it be testing, feedback, suggestions...

Especially, huge props to @ScriptedAlchemy for pushing and helping so hard with the Webpack 5 support. You should definitely go support his work. Merci à toi Zack!