I want to use this svg loader, https://github.com/jhamlet/svg-react-loader
in the instruction I followed the usage, like
import Logo from 'svg-react-loader?name=Logo!../images/logo.svg';
But I got error
Line 3: Unexpected '!' in 'svg-react-loader?name=Logo!../images/logo.svg'. Do not use import syntax to configure webpack loaders import/no-webpack-loader-syntax
That is not an error from webpack, but from ESLint, specifically from eslint-plugin-import.
Using inline loaders is generally not recommended and the ESLint rule import/no-webpack-loader-syntax exists to warn you from doing this. If you do want to use inline loaders and don't want ESLint to complain, you can disable the rule in your .eslintrc.
"rules": {
"import/no-webpack-loader-syntax": "off"
}
Or you can disable the rule just for that specific import, if you want to be warned about inline loaders, except for this one, because you might need it in this particular case.
// eslint-disable-next-line import/no-webpack-loader-syntax
import Logo from 'svg-react-loader?name=Logo!../images/logo.svg';
easier and safer solution is to add the following line to the file where you want to use the inline loaders:
/* eslint import/no-webpack-loader-syntax: off */
this will switch this option only for the file that includes this line.
