どのように私は、get WebPACKの2箇所に出力を放出することができますか?

JA:

次のように私の現在の構成は次のとおりです。

output: {
  filename: 'bundle.js',
  path: OUT_DIR
},

しかし、私は2つのディレクトリに移動するにはbundles.js必要がありますか?

私は単にパスにディレクトリの配列を渡すことによって、これを達成することはできますか?

それとも私は、より複雑な何かをする必要がありますか?

現在、私はbashスクリプト持ってcpll、私は各ビルド後に手動で入力する必要があり、それは退屈です。

うまくいけば、ウェブパックは、2箇所以上に出力を送信する設定オプションがあります。

研究

Google検索

このSOの質問は4歳で、私が見ているの午前何を持っていない- そう

ドキュメントはここでそれを行う方法を言及していない- のWebPACK

設定オプションがない場合はどのように私はそれが自動的にbashコマンドを実行して持つことができますか?

私はそれを文字列の配列の代わりに文字列を渡してみました、それは明らかに誤りで墜落しました。

無効な構成オブジェクト。WebPACKのは、APIのスキーマと一致しない構成オブジェクトを使用して初期化されています。 - configuration.output.pathは文字列でなければなりません。

配列を渡すと、動作しません。うーん。

グーグルで始まる別のアプローチをしよう- 検索

-可能な解決策を表示しますので、

要求ごと - 完全exportFunc

const exportFunc = ( env ) => {
  console.log('webpack.config.js-exportFunc', OUT_DIR);
  return {
    entry: `${IN_DIR}/index.jsx`,
    output: {
      filename: 'bundle.js',
      path: '/Users/c/_top/ll-front/dist'
    },
    module: {
      rules: [
        {
          test: /\.css$/,
          use: [ 'style-loader', 'css-loader' ]
        },
        {
          test: /\.jsx?/,
          include: IN_DIR,
          use: {
            loader: 'babel-loader',
            options: {
              presets: ['@babel/preset-env', '@babel/preset-react'],
              plugins: ['@babel/plugin-proposal-object-rest-spread', '@babel/plugin-proposal-class-properties'],
            }
          }
        }
      ]
    }
  };
};

module.exports = exportFunc;
sdgluck:

あなたは使用することができますWebPACKののマルチコンパイラモードをコンフィグの配列をエクスポートすることによって。

ドキュメントのように:

代わりに、単一の構成オブジェクト/機能をエクスポートするのには、(複数の機能がWebPACKの3.1.0以降でサポートされている)複数の設定をエクスポートすることがあります。WebPACKのを実行している場合は、すべての構成が構築されています。

例えば:

const config = {
  // your webpack config
}

const outputPaths = ["path/one", "path/two"]

module.exports = outputPaths.map(outputPath => {
  return {
    ...config,
    name: outputPath,
    output: {
      ...config.output,
      path: path.resolve(__dirname, outputPath)
    }
  }
})

あなたは機能の設定を使用しているとして、あなたはこのような何かを行うことができます。

const outputPaths = ["path/one", "path/two"]

module.exports = outputPaths.map(outputPath => {
  return env => {
    return {
      entry: `${IN_DIR}/index.jsx`,
      output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, outputPath)
      },
      module: {
        rules: [
          {
            test: /\.css$/,
            use: [ 'style-loader', 'css-loader' ]
          },
          {
            test: /\.jsx?/,
            include: IN_DIR,
            use: {
              loader: 'babel-loader',
              options: {
                presets: ['@babel/preset-env', '@babel/preset-react'],
                plugins: ['@babel/plugin-proposal-object-rest-spread', '@babel/plugin-proposal-class-properties'],
              }
            }
          }
        ]
      }
    };
  }
})

おすすめ

転載: http://43.154.161.224:23101/article/api/json?id=15700&siteId=1