web-dev-qa-db-ja.com

拡張機能なしでjsxをインポートするとEslintエラーが発生する

Es6で、.jsx拡張子を必要とせずにjsxファイルをインポートしようとしています。

import LoginErrorDialog from './LoginErrorDialogView';

ない:

import LoginErrorDialog from './LoginErrorDialogView.jsx';

この方法でwebpackを正常にインポートできますが、次のようになります。

export default {
  entry: './src/ui/js/app.js',
  output: {
    publicPath: '/',
    filename: 'bundle.js'
  },
  resolve: {
    extensions: ['.js', '.jsx'],

エスリント(esw webpack.config.* ./ --color --ext .js --ext .jsx)はまだエラーです。

Unable to resolve path to module './LoginView' import/no-unresolved

何か案は?

17
gazzwi86

ここでも同じ問題が発生し、.eslintに構成を追加する問題を修正しました。

プロパティの追加を拡張します。

"plugin:import/react"

プロパティの追加の設定:

"import/resolver": {
  "node": {
    "extensions": [".js",".jsx"]
   }
}

あなたの.eslintは似ています:

{
    "extends": [
        ...
        "plugin:import/react",
        ...
    ],
   ...
    "settings": {
        "import/resolver": {
          "node": {
            "extensions": [".js",".jsx"]
          }
        }
    },
...
}
14
Carlos