2

私が何を間違っているのかわからないので、この構成についての洞察をいただければ幸いです。次のエラーが表示されます。

エラー: 新しい WebpackOptionsValidationError(webpackOptionsValidationErrors) をスローします

/var/www/homelyfe/hl-app/node_modules/webpack/lib/webpack.js:16
        throw new WebpackOptionsValidationError(webpackOptionsValidationErrors);
        ^
WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
 - configuration.module.rules[1].use[0] should be one of these:
   string | object { loader?, options?, query? }
 - configuration.module.rules[1].use should be one of these:
   string | object { loader?, options?, query? } | [string | object { loader?, options?, query? }]
    at webpack (/var/www/homelyfe/hl-app/node_modules/webpack/lib/webpack.js:16:9)
    at processOptions (/var/www/homelyfe/hl-app/node_modules/webpack-dev-server/bin/webpack-dev-server.js:310:17)
    at Object.<anonymous> (/var/www/homelyfe/hl-app/node_modules/webpack-dev-server/bin/webpack-dev-server.js:374:1)
    at Module._compile (module.js:413:34)
    at Object.Module._extensions..js (module.js:422:10)
    at Module.load (module.js:357:32)
    at Function.Module._load (module.js:314:12)
    at Function.Module.runMain (module.js:447:10)
    at startup (node.js:141:18)
    at node.js:933:3
error Command failed with exit code 1.

私の WEBPACK 構成ファイル:

const path = require("path");
const merge = require("webpack-merge");
const htmlWebpackPlugin = require( "html-webpack-plugin" );
const parts = require( "./webpack.config.parts" );
const PATHS = {
    app : path.join( __dirname, "app" ),
    build : path.join( __dirname, "build" )
};
const TARGET = process.env.BUILD_DEV || process.env.BUILD_PROD;

const common = {
    entry : {
        app : PATHS.app + "/index.js"
    },
    output : {
        filename : "run.build.js",
        path : PATHS.build,
        publicPath : "/assets/"
    },
    resolve : {
        extensions : [ "js", "jsx" ]
    },
    module : {
        rules : [
            {
                test : /\.jsx?$/,
                use : [
                    {
                        loader : "babel-loader",
                        options : {
                            presets : [
                                "react",
                                "es2015"
                            ]
                        }
                    }
                ],
                include : PATHS.app
            }
        ]
    }
};

var config;

switch( process.env.npm_lifecycle_event ){
    case( "buildProd" ):
        config = merge( common,
                             parts.defineENV(),
                             parts.sourceMaps( "__PROD__" ),
                             {} );
    case( "startDev" ):
    default:
        config = merge( common,
                             parts.defineENV(),
                             parts.sourceMaps( "__DEV__" ),
                             parts.devServer( PATHS.app ),
                             parts.eslint(PATHS.app, path.join( __dirname, ".eslintrc" )),
                             parts.devtool(),
                             parts.htmlWebpackPlugin( "---TESTING---" ));
};

module.exports = config;

明らかに、エラーで通知されたように、マージ関数に何か問題がありますが、返されたオブジェクトは問題ないようです。config obj (メインの webpack.config obj) の出力は次のとおりです。

構成出力オブジェクト:

{
  entry:{
    app: '/var/www/homelyfe/hl-app/app/index.js'
  },
  output:{
    filename: 'run.build.js',
    path: '/var/www/homelyfe/hl-app/build',
    publicPath: '/assets/'
  },
  resolve:{
    alias:{
      assets: '/var/www/homelyfe/hl-app/app/assets',
      components: '/var/www/homelyfe/hl-app/app/components'
    },
    extensions: [ 'js', 'jsx' ]
  },
  module:{
    rules:[
      { test: /\.jsx?$/,
        use:[
          { loader: 'babel-loader',
            options : {
              presets : [
                "react",
                "es2015"
              ]
            }
          }, 
        ],
        include: '/var/www/homelyfe/hl-app/app'
      },
      { test: /\.jsx?$/,
        use: [ 
          { enforce: 'pre', 
            loader: 'eslint-loader',
            query: [Object] } 
        ],
        include: '/var/www/homelyfe/hl-app/app'
      }
    ]
  },
  plugins: 
   [ DefinePlugin { definitions: [Object] },
     HotModuleReplacementPlugin { multiStep: true, fullBuildTimeout: 200 },
     HtmlWebpackPlugin { options: [Object] } ],
  devtool: 'eval-source-map',
  devServer: 
   { historyApiFallback: true,
     hot: true,
     inline: true,
     stats: 'errors-only' } }
4

2 に答える 2