Come specificare l'opzione cacheDirectory quando si utilizza babel-loader con webpack?

Question

C'è un'opzione cacheDirectory in babel-loader. Non riesco a capire come usarlo con il seguente setup webpack:

var compiler = webpack({ 
    context: path.resolve(__dirname + "/../../" + rootModuleDir + "/" + modules[ module ]), 
    entry: "./index.jsx", 
    resolve: { 
     root: path.resolve(__dirname + "/../../assets/js/lib/react"), 
     extensions: [ "", ".js", ".jsx" ] 
    }, 
    output: { 
     path: targetDir, 
     filename: modules[ module ] + ".js" 
    }, 
    module: { 
     loaders: [ 
      { test: /\.jsx?$/, exclude: /node_modules/, loader: "babel-loader?optional=runtime" } 
     ] 
    }, 
    plugins: [ 
     //new webpack.optimize.UglifyJsPlugin(), 
     new webpack.SourceMapDevToolPlugin({ 
      filename: "[file].map" 
     }) 
    ] 
}); 

Dove dovrebbe andare?

Answer 1

è possibile aggiungerlo alla configurazione babel-loader in questo modo:

loaders: [ 
    { 
     test: /\.jsx?$/, 
     exclude: /node_modules/, 
     loader: "babel-loader?optional=runtime&cacheDirectory" 
    } 
] 

Nota, non si dovrebbe aggiungere =true, questo è inutile e imposterà il cacheDirectory per utilizzare una directory denominata true. Riferimento: using cacheDirectory fails with Error

È inoltre possibile utilizzare la proprietà query:

rules: [ 
    { 
     test: /\.jsx?$/, 
     exclude: /node_modules/, 
     loader: "babel-loader", 
     query: { 
      optional: "runtime", 
      cacheDirectory: true 
     } 
    } 
] 

Quando si utilizza la proprietà query, specificando true consentirà l'opzione, e specificando un valore stringa consentirà l'opzione e configurarlo per l'utilizzo che nome della directory. Riferimento: query parameters

Answer 2

Aggiungilo alla stringa loader in questo modo:

module: { 
    loaders: [ 
     { test: /\.jsx?$/, exclude: /node_modules/, loader: "babel-loader?optional=runtime&cacheDirectory=true" } 
    ] 
},