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 ?
@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.
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.