boopathi/react-svg-loader

Getting "Expected identifier, string or number" error in Edge with rollup

sreahard opened this issue · 4 comments

This is my rollup config file:

import resolve from "rollup-plugin-node-resolve"
import babel from "rollup-plugin-babel"
import commonjs from "rollup-plugin-commonjs"
import postcss from "rollup-plugin-postcss"
import { terser } from "rollup-plugin-terser"
import reactSvg from "rollup-plugin-react-svg"

export default {
  input: "src/index.js",
  output: {
    file: "dist/index.js",
    format: "cjs"
  },
  external: ["react", "react-proptypes"],
  plugins: [
    resolve(),
    postcss({
      autoModules: true,
      namedExports: true,
      modules: true,
      extensions: [".css", ".less"]
    }),
    babel({
      exclude: "node_modules/**"
    }),
    reactSvg({
      // svgo options
      svgo: {
        plugins: [], // passed to svgo
        multipass: false
      },
      // whether to output jsx
      jsx: false,
      include: '**/*.svg',
      exclude: null
    }),
    commonjs(),
    terser()
  ]
}

This is my .babelrc config:

{
  "presets": [["@babel/env", { "modules": false }], "@babel/preset-react"],
  "plugins": ["@babel/plugin-proposal-object-rest-spread"]
}

Everything works in Chrome, FireFox and Safari with this config.

I've also encountered this issue, except I'm using webpack. Some more context for this issue - Edge doesn't support object spread syntax so it throws an error when it tries to parse ... operator in JavaScript code:

a=({styles:e={},...t})=>

I suspect this has to do with tweaking babel-preset-env and/or browserlist configs

Maybe to fix this we could pass add an option to pass presets (like @babel/env) instead of just the jsx option ?

presets: [jsx ? void 0 : require.resolve("@babel/preset-react")].filter(

@christophehurpeau When using webpack adding babel-loader after react-svg-loader transpiles final code. However, with rollup it's different story, so your proposed solution could probably work fine.

I eventually ended up using svgr since it doesn't have this issue.

stale commented

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.