search

airbnb / babel-plugin-inline-react-svg

A babel plugin that optimizes and inlines SVGs for your React Components.
MIT License
474 stars 92 forks source link

Fix crash when SVGO is turned off #100

Closed connor-baer closed 3 years ago

connor-baer commented 3 years ago

Purpose

The plugin crashes when SVGO is turned off (e.g. [['inline-react-svg', { svgo: false }]]). Here's the error message:

/home/runner/work/icons/icons/node_modules/babel-plugin-inline-react-svg/lib/escapeBraces.js:24
    data: raw.data.replace(/(\{|\})/g, '{`$1`}')
Full stack trace ``` TypeError: /home/runner/work/icons/icons/AddItemFilled.js: Cannot read property 'replace' of undefined at escapeBraces (/home/runner/work/icons/icons/node_modules/babel-plugin-inline-react-svg/lib/escapeBraces.js:24:20) at applyPlugin (/home/runner/work/icons/icons/node_modules/babel-plugin-inline-react-svg/lib/index.js:112:58) at PluginPass.ImportDeclaration (/home/runner/work/icons/icons/node_modules/babel-plugin-inline-react-svg/lib/index.js:199:11) at newFn (/home/runner/work/icons/icons/node_modules/@babel/traverse/lib/visitors.js:175:21) at NodePath._call (/home/runner/work/icons/icons/node_modules/@babel/traverse/lib/path/context.js:55:20) at NodePath.call (/home/runner/work/icons/icons/node_modules/@babel/traverse/lib/path/context.js:42:17) at NodePath.visit (/home/runner/work/icons/icons/node_modules/@babel/traverse/lib/path/context.js:92:31) at TraversalContext.visitQueue (/home/runner/work/icons/icons/node_modules/@babel/traverse/lib/context.js:116:16) at TraversalContext.visitMultiple (/home/runner/work/icons/icons/node_modules/@babel/traverse/lib/context.js:80:17) at TraversalContext.visit (/home/runner/work/icons/icons/node_modules/@babel/traverse/lib/context.js:142:19) ```

Approach & Changes

Note: PR https://github.com/airbnb/babel-plugin-inline-react-svg/pull/49 which adds a test for this use case should be merged alongside this to prevent future regressions.

ghost commented 3 years ago

Any chance to update the npm package with this very useful PR?

lencioni commented 3 years ago

This has been published in v2.0.1

YaoKaiLun commented 3 years ago

Still not working. When I set "['inline-react-svg', { svgo: false }]"，and import a normal svg，babel throw an error "Unexpected token"

ljharb commented 3 years ago

@YaoKaiLun can you file a new issue, and include the full svg content in question?

YaoKaiLun commented 3 years ago

👌

YaoKaiLun commented 3 years ago

@ljharb I found it was my problem, my svg file has the below unclosed tag <?xml version="1.0" encoding="UTF-8"?>