2016-12-08 86 views
2

我有一個大項目,我想分成多個package.json的,這樣的每個部分的依賴關係可以清楚地說明,所以這些包可以導出爲個別部分。多個package.jsons與ES6 Babel

但是,我希望我的應用程序包含每個這些軟件包,並使用webpack和babel進行編譯。這些軟件包有共享的依賴關係,所以我不想僅將每個文件輸出到/ dist文件夾。

我理想中的目錄結構如下:

\main 
    \app 
    \node_modules 
    package.json 
\package1 
    package.json 
    node_modules 
    index.js 
\package2 
    package.json 
    node_modules 
    index.js 

我試過多種方法:

  1. 使用的WebPack的決心模塊,像path.resolve('app')。即使它理論上是這樣,這也行不通。
  2. 使用main的package.json引用其他人使用"package1" : "file:../package1"。這不會將package1視爲es6 javascript並引發錯誤。在webpack配置中使用resolveLoaders不起作用。

我擁有的webpack配置如下。

module: { 
loaders: [ 
    { 
     test: /\.js?/, 
     loader: 'babel-loader', 
     include: [ 
      path.resolve('app'), 
      path.resolve('../prose'), 
     ], 
     query: { 
      plugins: [ 
       ['react-transform', { 
        transforms: [{ 
         transform: 'react-transform-hmr', 
         // If you use React Native, pass 'react-native' instead: 
         imports: ['react'], 
         // This is important for Webpack HMR: 
         locals: ['module'] 
        }] 
       }], 
       ['transform-object-assign'] 
      ] 
     } 
    }, 
    { test: /\.css$/, loader: 'style-loader!css-loader!sass-loader' }, 
    { test: /\.svg$/, loader: 'file-loader' }, 
    { test: /\.png$/, loader: 'file-loader' }, 
    { test: /\.jpg$/, loader: 'file-loader' }, 
    { test: /\.json$/, loader: 'json-loader' } 
] 
}, 
resolve: { 
    modules: [ 
     path.resolve('app'), 
     'node_modules', 
    ], 
    extensions: ['.json', '.js', '.jsx'], 
} 

任何想法或做其他項目的例子,將不勝感激!

回答

2

您應該檢查出lerna。它使您能夠在一個倉庫中使用多個package.jsons甚至包。它可能會幫助你滿足你的要求。

相關問題