CODEWITHSUNDEEP
reactjsecmascript-6linteslint
Leonardo
Leonardo

Reputation: 4228

Eslint babel suppress error when importing styles into react component

I'm using es6 react and I import my styles into a component with:

import styles from './MyStyle.sass';

I'm linting with eslint with these npm modules: 

"babel-eslint": "^6.1.2",
"eslint": "^3.16.0",
"eslint-plugin-react": "^6.10.0",

and here's my (a bit long) .eslintrc.yml file:

---
  extends:
    - plugin:react/recommended

  env:
    browser: true
    node: true
    es6: true

  parserOptions:
   ecmaVersion: 6
   sourceType: "module"
   ecmaFeatures:
    jsx: true

  globals:
    __DEV__: true
    __SERVER__: true

  plugins:
    - react

  parser: "babel-eslint"
  rules:
    react/jsx-uses-vars: 1
    react/prop-types: [1, { ignore: [children] }]

    semi: 0
    key-spacing: 1
    curly: 0
    consistent-return: 0
    space-infix-ops: 1
    camelcase: 0
    no-spaced-func: 1
    no-alert: 1
    eol-last: 1
    comma-spacing: 1
    eqeqeq: 1

    # possible errors
    comma-dangle: 0
    no-cond-assign: 2
    no-console: 0
    no-constant-condition: 2
    no-control-regex: 2
    no-debugger: 2
    no-dupe-args: 2
    no-dupe-keys: 2
    no-duplicate-case: 2
    no-empty-character-class: 2
    no-empty: 2
    no-ex-assign: 2
    no-extra-boolean-cast: 2
    no-extra-parens: 0
    no-extra-semi: 2
    no-func-assign: 2
    no-inner-declarations: 2
    no-invalid-regexp: 2
    no-irregular-whitespace: 2
    no-negated-in-lhs: 2
    no-obj-calls: 2
    no-regex-spaces: 2
    no-sparse-arrays: 2
    no-unexpected-multiline: 2
    no-unreachable: 2
    use-isnan: 2
    valid-jsdoc: 2
    valid-typeof: 2

    no-redeclare: 2

    init-declarations: 2
    no-catch-shadow: 2
    no-delete-var: 2
    no-label-var: 2
    no-shadow-restricted-names: 2
    no-shadow: 2
    no-undef-init: 2
    no-undef: 2
    no-undefined: 2
    no-unused-vars: 2
    no-use-before-define: 2

The problem is that eslint complain that "Default export is not declared in imported modules" regarding the imported styles module.

Edit:
1) The same question applies for imports such as 

import logo_img from './img/home_logo.png'

2) Of course I am using webpack and the style/sass/css/url/file loaders

Question:
How can I suppress this warning?

Upvotes: 0

Views: 710

Answers (1)

Leah Zorychta
Leah Zorychta

Reputation: 13409

You can mask the warning by doing a batch import like so:

import * as styles from './MyStyle.sass';

You can also include regular node modules this way as well, as this error is quite common when importing those too.

Upvotes: 1

Related Questions