Getting build error while adding this.

[bannarisoftwares]

Getting following error while adding this

Error: While loading the Rollup configuration from "rollup.config.js", Node tried to require an ES module from a CommonJS file, which is not supported. A common cause is if there is a package.json file with "type": "module" in the same folder. You can try to fix this by changing the extension of your configuration file to ".cjs" or ".mjs" depending on the content, which will prevent Rollup from trying to preprocess the file but rather hand it to Node directly.

My rollup.config.js

import peerDepsExternal from "rollup-plugin-peer-deps-external";
import resolve from "@rollup/plugin-node-resolve";
import commonjs from "@rollup/plugin-commonjs";
import typescript from "rollup-plugin-typescript2";
import postcss from "rollup-plugin-postcss";
import copy from "rollup-plugin-copy";
import svg from "rollup-plugin-svg-import";


const packageJson = require("./package.json");

export default {
  input: "src/index.ts",
  output: [
    {
      file: packageJson.main,
      format: "cjs",
    },
    {
      file: packageJson.module,
      format: "esm",
    },
  ],
  external: [
    "react",
    "react-dom",
    "prop-types",
    "@emotion/react",
    "@emotion/styled",
    "@mui/lab",
    "@mui/icons-material",
    "@mui/material",
    "@mui/material/styles",
    "@mui/styles",
  ],
  plugins: [
    peerDepsExternal(),
    resolve(),
    commonjs(),
    typescript({ useTsconfigDeclarationDir: true }),
    postcss({
      extensions: [".css", ".scss", ".less"],
      use: ["sass", ["less", { javascriptEnabled: true }]],
    }),
    copy({
      targets: [
        {
          src: "src/variables.scss",
          dest: "build",
          rename: "variables.scss",
        },
        {
          src: "src/typography.scss",
          dest: "build",
          rename: "typography.scss",
        },
      ],
    }),
    svg({
      // process SVG to DOM Node or String. Default: false
      stringify: false
    })
  ],
};

[korywka]

@bannarisoftwares Greetings. Does your build works without this plugin? Don't see any errors about rollup-plugin-svg-import

[bannarisoftwares]

Thanks for reply @korywka , I recently added from iconify-react package, So i am getting following error after adding this, So i suspect this error raises due to svg

[!] (plugin commonjs) SyntaxError: Unexpected token (56:17) in /Users/natheeshkumar/Desktop/DCULUS/components.dculus.ui/src/theme/overrides/Alert.js
src/theme/overrides/Alert.js (56:17)
54:       defaultProps: {
55:         iconMapping: {
56:           error: <Iconify icon="solar:danger-bold" width={24}/>,
                     ^
57:           info: <Iconify icon="eva:info-fill" width={24}/>,
58:           success: <Iconify icon="eva:checkmark-circle-2-fill" width={24}/>,
SyntaxError: Unexpected token (56:17) in /Users/natheeshkumar/Desktop/DCULUS/compon

[korywka]

This package is ES module and doesn't use any require from commonjs. Would be nice to see your minimal example to reproduce. I am almost sure the problem is caused by something else.