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
我試過多種方法:
- 使用的WebPack的決心模塊,像
path.resolve('app')
。即使它理論上是這樣,這也行不通。 - 使用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'],
}
任何想法或做其他項目的例子,將不勝感激!