Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

@svgr/webpack v6.1 - fails due to a duplicate default export #645

Closed
ghost opened this issue Dec 2, 2021 · 2 comments · Fixed by #648 · May be fixed by GabrielNathan12/to-do-list-agent#49
Closed

@svgr/webpack v6.1 - fails due to a duplicate default export #645

ghost opened this issue Dec 2, 2021 · 2 comments · Fixed by #648 · May be fixed by GabrielNathan12/to-do-list-agent#49

Comments

@ghost
Copy link

ghost commented Dec 2, 2021

🐛 Bug Report

Build fails with svgr/webpack & url-loader due to:

ERROR in ../../libs/ui/src/lib/components/Toggle/on.svg 40:7
Module parse failed: Duplicate export 'default' (40:7)
File was processed with these loaders:
 * ../../node_modules/@svgr/webpack/dist/index.js
 * ../../node_modules/file-loader/dist/cjs.js
You may need an additional loader to handle the result of these loaders.
| export { ForwardRef as ReactComponent };
| export default __webpack_public_path__ + "assets/svg/on.3827650.svg";
> export default __webpack_public_path__ + "assets/svg/on.3827650.svg";

To Reproduce

Steps to reproduce the behavior:

  • Install @svgr/webpack@6.1
  • Setup webpack similarly to the config below
  • Export an SVG as follows:
export { ReactComponent as StarIcon } from './star.svg'
export { default as StarIcon } from './star.svg'
  • Consume them in the app you're building

Webpack loaders:

{
   module: {
     rules: {
        test: /\.svg$/i,
        oneOf: [
          {
            issuer: /\.[jt]sx?$/,
            use: [
              {
                loader: '@svgr/webpack',
                options: svgrConfig
              },
              {
                loader: 'file-loader',
                options: {
                  limit: 10000, // 10kB
                  name: '[name].[hash:7].[ext]',
                  outputPath: 'assets/svg'
                }
              }
            ]
          },
          {
            type: 'asset/resource',
            generator: {
              filename: 'assets/svg/[name].[hash][ext][query]'
            }
          }
        ]
     }
   }
}

Expected behavior

Should not error, just as previous versions - works as expected on 6.0.0

Link to repl or repo (highly encouraged)

Please provide a minimal repository on GitHub.

Issues without a reproduction link are likely to stall.

Run npx envinfo --system --binaries --npmPackages @svgr/core,@svgr/cli,@svgr/webpack,@svgr/rollup --markdown --clipboard

Paste the results here:

## System:
 - OS: macOS 12.0.1
 - CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
 - Memory: 2.36 GB / 32.00 GB
 - Shell: 5.8 - /bin/zsh
## Binaries:
 - Node: 16.13.0 - /usr/local/bin/node
 - Yarn: 3.1.0 - /usr/local/bin/yarn
 - npm: 8.1.0 - /usr/local/bin/npm
## npmPackages:
 - @svgr/rollup: 5.5.0 => 5.5.0 
 - @svgr/webpack: 6.1.0 => 6.1.0 
@open-collective-bot
Copy link

Hey @danr-za 👋,
Thank you for opening an issue. We'll get back to you as soon as we can.
Please, consider supporting us on Open Collective. We give a special attention to issues opened by backers.
If you use SVGR at work, you can also ask your company to sponsor us ❤️.

@tychenjiajun
Copy link

Have the same issue even if I downgrade the version to 6.0.0. I use a custom loader as a work around.

export default function (source) {

  // Apply some transformations to the source...

  return source.replace(/export default .*\n/, '');
}

webpack.config.js

use: [
                            {
                                loader: path.resolve(__dirname, './removeDuplicateExportLoader'),
                            },
                            {
                                loader: require.resolve('@svgr/webpack'),
                                options: {
                                    titleProp: true,
                                    // typescript: true,
                                    exportType: 'named',
                                    svgo: false,
                                },
                            },
                            {
                                loader: 'file-loader',
                                options: {
                                    name: 'images/[hash].[ext]',
                                },
                            },
                        ],

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
1 participant