Webpack 2 expected '!' error using import

Question

I want to use this svg downloader, https://github.com/jhamlet/svg-react-loader

in the instructions I followed the usage, for example

import Logo from 'svg-react-loader?name=Logo!../images/logo.svg';

But I got an 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

Answer 1

This is not a web package error, but from ESLint, in particular from eslint-plugin-import.

Using built-in loaders is generally not recommended, and the ESLint rule is import / no-webpack-loader-syntax to warn you about this. If you want to use the built-in bootloaders and do not want ESLint to file complaints, you can disable this rule in .eslintrc.

"rules": {
  "import/no-webpack-loader-syntax": "off"
}

, , , , .

// eslint-disable-next-line import/no-webpack-loader-syntax
import Logo from 'svg-react-loader?name=Logo!../images/logo.svg';