Question

首先，Webpack2（2.3.3）配置代码：

//========== Imports =========================================================//

const path    = require("path");
const webpack = require("webpack");

//========== Exports =========================================================//

module.exports = {

  entry: [
    "./src/js/main.js"
  ], // Entry //

  output: {
    path       : path.resolve(__dirname, './dist'),
    publicPath : "/",
    filename   : "[name].bundle.js"
  }, // Output //

  module: {
    rules: [ { // [.tsx] TypeScript Loader //
      test    : /\.tsx$/,
      include : [path.resolve(__dirname, "./src/ts") ],
      use     : [ {
        loader : "ts-loader"
      }, {
        loader : "wc-loader"
      } ] // Use //
    }, { // [.html] WebComponent Loader //
      test    : /\.html$/,
      include : [path.resolve(__dirname, "./src/components") ],
      use     : [ {
        loader  : "babel-loader",
        options : {presets: [ ["es2015", {modules: false} ] ] }
      }, {
        loader : "wc-loader",
      } ] // Use //
    }, { // [.js] Javascript -> Babel Loader //
      test    : /\.js$/,
      include : [path.resolve(__dirname, "./src/js") ],
      exclude : [/node_modules/],
      use     : [ {
        loader  : "babel-loader",
        options : {presets: [ ["es2015", {modules: false} ] ] }
      }, {
        loader : "wc-loader"
      } ] // Use //
    }, { // [.png|.jpg|.gif|.svg] File Loader //
      test : /\.(png|jpg|gif|svg)$/,
      use  : [ {
        loader : "file-loader"
      } ] // Use //
    }, { // [.scss] Sass Loader //
      test : /\.scss$/,
      use  : [ {
        loader : "sass-loader"
      } ] // Use //
    } ] // Rules //
  } // Module //

};

是否有方法为每个加载链设置输出文件夹？（Javascript进入一个目录，图像进入另一个目录，等等）

喜欢在“使用”的“选项”中提供它吗？

Answer 1

我最终使用ExtractText插件来分割WebPack 2的字体和CSS。用“css-loader”（错误）不能正常工作所以我只是将它从“sass-loader”传递给了“raw- loader“而不是通过”css-loader“：）

WebPack 2 - 如何输出到use / loader链中的各种其他文件夹

1 个答案: