メモ > 技術 > 開発: Webpack > babelを使ってES6をコンパイル
babelを使ってES6をコンパイル
※追加パッケージをインストール
>npm install -D babel-loader babel-core babel-preset-env
webpack.config.js にローダーの設定を追加する
これでES6で書いたコードをES5に変換してくれる
module.exports = {
// watchモードを有効にする
watch: true,
// メインとなるJavaScriptファイル（エントリーポイント）
entry: './js/main.js',
// ファイルの出力設定
output: {
// 出力ファイルのディレクトリ名
path: __dirname + '/js/',
// 出力ファイル名
filename: 'bundle.js'
},
// ローダーの設定
module: {
rules: [{
// ローダーの処理対象ファイル
test: /\.js$/,
// ローダーの処理対象から外すディレクトリ
exclude: /node_modules/,
// 利用するローダー
use: [{
loader: 'babel-loader',
options: {
presets: ['env']
}
}],
}],
},
};
Advertisement