webpackでサーバー側のモジュールを無害化したい
browserifyであれば、ignoreに追加したモジュールは無害化され、require()は空の参照を返します。
webpackで同様のことをしたいと思い、以下のようなwebpack.config.babel.js
のexternal
を利用してビルドを行いましたが、htmlから読み込むとReferenceError: express is not defined
となってしまいます。
npm run build
# > webpack-external-trouble@ build /Users/59naga/Downloads/fuga
# > webpack
# Hash: 6a8e05a3b6e4983a8b39
# Version: webpack 1.12.2
# Time: 229ms
# Asset Size Chunks Chunk Names
# bundle.js 2.24 kB 0 [emitted] main
# bundle.js.map 1.91 kB 0 [emitted] main
# + 2 hidden modules
webpack.config.babel.js
import webpack from 'webpack'
export default {
context: __dirname,
entry: "./index.js",
output: {
path: __dirname,
filename: 'bundle.js'
},
externals: [
'express',
],
module: {
loaders: [
{
test: /\.js$/,
exclude: /node_modules/,
loaders: ["babel-loader"],
},
],
},
devtool: '#source-map',
}
package.json
{
"name": "webpack-external-trouble",
"private": true,
"scripts": {
"build": "webpack"
},
"dependencies": {
"babel-core": "^5.8.33",
"babel-loader": "^5.3.3",
"express": "^4.13.3",
"webpack": "^1.12.2"
},
"babel": {
"stage": 0
}
}
index.js
// Dependencies
import express from 'express'
// Publish as singleton
class Module{
}
export default new Module
bundle.js
を読み込んでも、ReferenceError: express is not defined
を起こさないためにはwebpack.config.babel.js
をどのように設定すればよいでしょうか?