The webpack executor uses hard-coded SWC config

[jasongerbes]

Current Behavior

The @nrwl/web:webpack executor uses hard-coded options for swc-loader. We've run into issues due to loose mode being hard-coded to true, as it causes some inconsistencies when spreading iterable arrays.

This is also inconsistent with @nrwl/js:swc, which allows for customisation via a .swcrc file.

Expected Behavior

The @nrwl/web:webpack executor should either:

• Provide an option to disable loose mode, or
• Allow customisation of the SWC config via a .swcrc file.

The swc-loader already provides support for external config via a .swcrc file, but this would require some changes to the @nrwl/web:webpack executor.

Steps to Reproduce

1. Create an empty Nx workspace.
2. Add a library that uses SWC: nx generate @nrwl/js:library my-lib --compiler=swc
3. Add an application that uses SWC: nx generate @nrwl/react:application my-app --compiler=swc

Observe that the library has a .swcrc file that can be customised, whereas the application does not.

Environment

Node : 16.14.2
OS   : darwin x64
npm  : 8.5.0

nx : 14.3.1
@nrwl/angular : Not Found
@nrwl/cypress : 14.3.1
@nrwl/detox : Not Found
@nrwl/devkit : 14.3.1
@nrwl/eslint-plugin-nx : 14.3.1
@nrwl/express : Not Found
@nrwl/jest : 14.3.1
@nrwl/js : 14.3.1
@nrwl/linter : 14.3.1
@nrwl/nest : Not Found
@nrwl/next : Not Found
@nrwl/node : Not Found
@nrwl/nx-cloud : 14.1.0
@nrwl/nx-plugin : 14.3.1
@nrwl/react : 14.3.1
@nrwl/react-native : Not Found
@nrwl/schematics : Not Found
@nrwl/storybook : 14.3.1
@nrwl/web : 14.3.1
@nrwl/workspace : 14.3.1
typescript : 4.7.3
---------------------------------------
Community plugins:
    nx-stylelint: 13.4.0

[iain-s-h]

I agree - we require control over configuration of loose mode.

[jasongerbes]

Some more context: The issue we're having is due to the combination of target: 'es5' (SWC's default) and loose: true (hard-coded in webpack executor).

This combination causes issues when using some ES6 features, such as spreading iterable arrays.

[underfisk]

I'm currently running into the same issue as @jasongerbes , so far I've built a tiny helper using swc-loader, swc only and compared it with babel (the outputs are different but only Nx attaches the wrong output due to the hardcoded config) Another issue found is that Nx does not pick up the generated .lib.swcrc config for us for production builds

Given the following example

export const shared = () => {
  const mySet = new Set()
  mySet.add('one')
  return [...mySet.keys()]
}

The output from Nx would end up being

var shared = function() {
    var mySet = new Set();
    mySet.add("one");
    return [].concat(mySet.keys());
};

The code above will never work as intended, in fact, the expected output would be (if we use babel it works as intended but for SWC it doesn't):

const shared = () => {
  const mySet = new Set();
  mySet.add('one');
  return [...mySet.keys()];
};

[gperdomor]

Same behavior for web:rollout executor --> https://github.com/nrwl/nx/blob/master/packages/rollup/src/executors/rollup/lib/swc-plugin.ts

[slavoroi]

We are having the same issue with trying to use Set with an array. [...new Set(roles)] doesn't work as expected.

Do you happen to have any news on that one?

[marwan38]

This oversight is silly and the fact that this issue hasn't been resolved since it was started is even sillier. I guess no one uses the swc compiler in the nx ecosystem? Otherwise this issue surely would've been resolved a long time ago.

[fortunato]

For now I work around this by overriding the webpack config like so:

// apps/my-app/webpack.config.js
const swcConfig = JSON.parse(fs.readFileSync('apps/my-app/.swcrc', 'utf-8'));
config.module.rules.find((rule) => rule?.loader?.includes('swc-loader')).options = swcConfig;

(I have a apps/my-app/.swcrc file with a custom configuration)

At current the default swc-loader configuration on my end is like so:

{
  jsc: {
    parser: { syntax: 'typescript', decorators: true, tsx: true },
    transform: { react: { runtime: 'automatic' } },
    loose: true
  }
}

[github-actions[bot]]

This issue has been automatically marked as stale because it hasn't had any recent activity. It will be closed in 14 days if no further activity occurs. If we missed this issue please reply to keep it active. Thanks for being a part of the Nx community! 🙏

[WonderPanda]

Bump

[underfisk]

@FrozenPandaz Is there a plan to support overriding this SWC config? This has been a blocked for us to get from babel to swc, i can try to help if this ain't fixed yet 🤔

[underfisk]

@FrozenPandaz Sorry for bumping again on this matter but I'm sort of surprised this wasn't yet addressed/mentioned in any of the recent major changes