Wie definiert man die Präzedenz von Loadern im Webpack?

Question

ich webpack einen Server bauen bauen verwenden, sieht die Config wie:

loaders: [ 
    { 
    test: /\.js$/, 
    exclude: [/node_modules/], 
    loader: "babel-loader", 
    query: { 
     presets: ["es2015", "react"], 
     plugins: ["transform-object-rest-spread"] 
    } 
    }, { 
    test: new RegExp(`/ 
     stardust 
     |redux-form 
     |axios 
     |shuffle 
    `), 
    loader: "null-loader" 
    } 
] 

Idee ist ziemlich einfach: Wenn etwas regexp in der zweiten Lader übereinstimmt, ist es nicht geladen werden soll. Es funktioniert gut, bis ich das geladen habe:

Es passt zu beiden Ladegeräten und in das Bündel geladen. Wie kann ich null-loader Vorrang vor dem babel machen?

Answer 1

Sie können Pre-Loader verwenden, wie in webpack documentation beschrieben, im Grunde verwenden Sie Ihre Regex mit Null-Loader als Pre-Loader auf diese Weise wird es vor Ihren Loadern gelöst werden. Wenn also regex mit null übereinstimmt, wird loader verwendet und das Modul wird nicht geladen.

Hier ist der modifizierte Code:

preLoaders: [ 
    { 
     test: new RegExp(`/ 
      stardust 
      |redux-form 
      |axios 
      |shuffle 
     `), 
     loader: "null-loader" 
    } 
], 
loaders: [ 
    { 
     test: /\.js$/, 
     exclude: [/node_modules/], 
     loader: "babel-loader", 
     query: { 
      presets: ["es2015", "react"], 
      plugins: ["transform-object-rest-spread"] 
     } 
    } 
] 

Die einzige andere Lösung, die ich denken kann, ist auf reguläre Ausdrücke verlassen Dateien ausschließen dieses Wort enthalten. Ich bin kein Experte in Regex, aber ich werde versuchen, einen Ausdruck vorschlagen:

loaders: [ 
    { 
     test: /^(?!stardust|redux-form|axios|shuffle)([a-zA-Z]+)\.js$/, 
     exclude: [/node_modules/], 
     loader: "babel-loader", 
     query: { 
      presets: ["es2015", "react"], 
      plugins: ["transform-object-rest-spread"] 
     } 
    } 
]