我在 mobx 上做了一个滑块并使用 webpack 3 捆绑它。我使用“externals”从滑块的捆绑包中排除了 mobx。然后我将它作为包发布,创建了一个 mobx-sandbox 并在那里安装了滑块。结果我收到一个错误,因为包无法导入 mobx。但我希望滑块会找到 mobx,因为我在沙盒页面上导入了它。
我也在控制台中收到:
[mobx] 警告:有多个 mobx 实例处于活动状态。这可能会导致意想不到的结果。
我错过了什么?
滑块webpack.config
:
var path = require('path');
var webpack = require('webpack');
module.exports = {
node: {
fs: "empty" // https://github.com/josephsavona/valuable/issues/9
},
devtool: 'source-map',
entry: {
bundle: [ "./src/index.js" ]
},
output: {
path: path.join(__dirname, "lib"),
filename: "index.js"
},
externals: {
'react': {
root: 'React',
commonjs2: 'react',
commonjs: 'react',
amd: 'react'
},
'react-dom': {
root: 'ReactDOM',
commonjs2: 'react-dom',
commonjs: 'react-dom',
amd: 'react-dom'
},
'mobx': {
root: 'mobx',
commonjs2: 'mobx',
commonjs: 'mobx',
amd: 'mobx'
},
'mobx-react': {
root: 'mobx-react',
commonjs2: 'mobx-react',
commonjs: 'mobx-react',
amd: 'mobx-react'
}
},
stats: {
colors: true,
reasons: true
},
resolve: {
extensions: ['.js']
},
module: {
loaders: [
{
test: /\.js$/,
exclude: /\/node_modules\//,
loader: 'babel-loader',
query: {
cacheDirectory: true
}
}
]
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new webpack.NoEmitOnErrorsPlugin()
]
};
滑块的.babelrc
{
"presets": ["es2015", "react", "stage-0"],
"plugins": ["transform-decorators-legacy"]
}