Webpack: экспорт в существующий модуль в окне
Моя цель - использовать Webpack для экспорта изолированного компонента в предполагаемый глобальный объект.
index.html<script>
var MyApp = window.MyApp || {};
MyApp.something = MyApp.something || {};
</script>
<script src="my-isolated-module.js"></script>
//
// other modules/components loaded here...
//
<script>
MyApp.something.myIsolatedModule.run();
</script>
В приведенном выше примере, я предполагаю, что есть глобальный объект / модуль, который имеет свойствоsomething
к нему будут прикреплены другие модули. Поэтому я хочу прикрепить свой изолированный модуль к глобальномуMyApp.something
объект, не разрушая ниMyApp
или жеMyApp.something
.
var webpack = require('webpack');
var UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin');
module.exports = {
target: 'web',
context: __dirname + '/src/',
entry: './main.jsx',
output: {
path: __dirname + '/dist/',
filename: 'app.bundle.js',
library: 'something',
libraryTarget: 'var'
},
resolve: {
extensions: ['', '.js', '.jsx']
},
module: {
loaders: [
{test: /\.jsx$/, loader: '../node_modules/jsx-loader'}
]
},
externals: {
react: {
root: 'React',
commonjs: 'react',
commonjs2: 'react',
amd: 'react'
}
},
plugins: [
new UglifyJsPlugin()
]
};
SRC / main.jsxmodule.exports = {
myIsolatedModule: require('./MyIsolatedModule')
};
Я пытался установить Webpack'soutput.libraryTarget
каждому возможному значению (см.http://webpack.github.io/docs/configuration.html#output-librarytarget), а также играть со значениемoutput.library
так, чтобы это включало прямое пространство имен в моем модуле. Ничто не работает так, как хотелось бы ...