web-dev-qa-db-ja.com

「バベルローダー」を解決できません

最初のノード反応アプリを構成しようとしています。

「babel-loaderを解決できません」というエラーが表示され続けます。

そのエラーをググって、うまくいかないいくつかの提案を見つけました。

1つ目は、webpack.config.jsに次を追加することです

// resolveLoader: {
  //       modulesDirectories: '/usr/local/lib/node_modules'
  //   },

それを試みると言うエラーが生成されます：

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
 - configuration.resolveLoader has an unknown property 'modulesDirectories'. These properties are valid:
   object { alias?, aliasFields?, cachePredicate?, descriptionFiles?, enforceExtension?, enforceModuleExtension?, extensions?, fileSystem?, mainFields?, mainFiles?, moduleExtensions?, modules?, plugins?, resolver?, symlinks?, unsafeCache?, useSyncFileSystemCalls? }

次の提案は試してみることです：

resolveLoader: {
        fallback: '/usr/local/lib/node_modules'
    },

それは同様のエラーを生成します。

この構成を開始する方法に関するアドバイスはありますか？ドキュメントを理解するのは難しいことがわかっています-Wordが1つおきに専門用語であり、このセットアップを始めるために何をする必要があるかについての基本的な理解を見つけるための参照ポイントを見つけることができません。

Webpack.config.jsは次のとおりです。

module.exports = {
  entry: './app/app.jsx',
  output: {
    path: __dirname,
    filename: './public/bundle.js'
  },

  resolve: {
    modules: [__dirname, 'node_modules'],
    alias: {
      Greeter: 'app/components/Greeter.jsx',
      GreeterMessage: 'app/components/GreeterMessage.jsx',
      GreeterForm: 'app/components/GreeterForm.jsx',

    },
    extensions: ['.js', '.jsx']
  },

  // resolveLoader: {
  //       fallback: '/usr/local/lib/node_modules'
  //   },

  module :{
    rules:[{
      // use : 'babel-loader',
      loader: 'babel-loader',
      query :{
        presets:['react','es2015']
        // ,'es2017'
      },
      test: /\.jsx?$/,
      exclude: /(node_modules|bower_components)/
    }
   ]
 }


};
node.jswebpackbabeljsnode-moduleswebpack-2
16
Mel

同じ問題がありました。 babel-loaderモジュールをインストールして修正しました：

yarn add babel-loader

または

npm install babel-loader

37
JESii