webpack/babel-loader ReferenceError verursacht durch relative Pfadangabe

Question

Ich habe versucht, dieses React + Relay-Beispiel einzurichten (https://github.com/RGRjs/rgrjs.com), und ich habe Probleme mit dem Auflösen des Pfades zu einem Webpack-Plugin für babel-loader. Wenn ich webpack in meinem Projektverzeichnis starte, erhalte ich die ReferenceError-Probleme, die meiner Meinung nach durch das Trennen von Plugin-Abhängigkeiten vom Webpack über den Kontext einzelner Dateien verursacht werden, die es zu erstellen versucht.

Details: ich mein Projekt als verknüpfte Repo strukturiert haben:

rgrjs: 
├── data 
| ├── schema.js 
| └── header.html 
├── js 
| ├── app.js 
| └── components 
| | └── Main.js 
├── public 
| └── bundle.js 
babelRelayPlugin.js 
webpack.config.js 

Und mit den webpack.config.js wie folgt einstellen:

var projectRoot = process.env.PWD; 
console.log('Project Rooted at ' + projectRoot); 
module.exports = { 
    context: projectRoot, 
    entry: "./js/app.js", 
    output: { 
     path: __dirname + "/public", 
     filename: "bundle.js" 
    }, 
    resolveLoader: { 
     root: projectRoot 
    }, 

    module:{ 
     loaders: [ 
      { 
       test:/\.js$/, 
       exclude: /node_modules/, 
       loader: 'babel-loader', 
       babelrc: false, 
       query: { 
        presets: ['react','es2015','stage-0'], 
        plugins: ['./babelRelayPlugin'] 
       } 
      } 
     ] 
    } 
}; 

Wenn ich zu bauen versuchen, ich erhalte den folgenden Fehler:

ERROR in ./js/app.js Module build failed: ReferenceError: Unknown plugin "./babelRelayPlugin" specified in "base" at 0, attempted to resolve relative to ".../rgrjs/js"

Das referenzierte "babelRelayPlugin" ist in dem root "rgrjs" Verzeichnis (das sollte "./" relativ zu Webpack sein). Wenn ich die Plug-Pfaddefinition auf „../babelRelayPlugin“ wechsle, löst die ./js/app.js die Referenz, aber ich bekomme ein anderes Problem:

ERROR in ./js/components/Main.js Module build failed: ReferenceError: Unknown plugin "../babelRelayPlugin" specified in "base" at 0, attempted to resolve relative to ".../rgrjs/js/components"

Andere Lösungen scheinen/mit vorzuschlagen Auflösungs-/resolveLoader Kontext, aber es scheint nicht zu funktionieren, wie in der Konfigurationsdatei gesehen. Richte ich das falsch ein oder ist das ein echter Fehler?

Beste

Answer 1

Es scheint, dass das Problem hier ist, dass webpack das Plugin Pfad als String ist vorbei, die in jedem transpile einer anderen Datei neu bewertet wird, und eher der Weg muss sich als streng definiert werden Pfad, wie unten:

var projectRoot = process.env.PWD; 
console.log('Project Rooted at ' + projectRoot); 

var path = require('path'); 

module.exports = { 
    //... 
    module:{ 
     loaders: [ 
      { 
       //... 
       loader: 'babel-loader', 
       query: { 
        presets: ['react','es2015','stage-0'], 
        plugins: [path.resolve(projectRoot,'babelRelayPlugin')] 
       } 
      } 
     ] 
    } 
}; 

Dies scheint für verschiedene Versionen/Builds nicht konsequent angewandt werden, da die gleiche Config-Datei und Ordner-Struktur auf einem anderen Computer fein gebaut.