今天接觸了webpack，第一次使用webpack進行轉碼，竟然稀里糊涂就成功了，哈哈。
下面附上流程
創建個文件夾，初始化一下，首先全局安裝webpack
npm install webpack --save-dev
然后安裝babel
npm install --save-dev babel-core babel-preset-es2015 npm install --save-dev babel-loader
在當前文件夾內執行安裝，然后創建兩個文件夾一個src作為源文件夾，一個bin，保存生成的文件夾的列表
在src文件夾內創建一個文件app.js，里面寫入現在瀏覽器不全支持的es6代碼
let a = 111; let b = 222; var xxx = (c,d) => c*d; console.log(xxx(a,b));
然后在根目錄創建一個文件名為webpack.config.js
module.exports = { entry: './src/app.js', output: { path: './bin', filename: 'app.bundle.js', }, module: { loaders: [{ test: //.js$/, exclude: /node_modules/, loader: 'babel-loader' }] } } 然后再創建一個用于babel調用的文件，名為.babelrc
里面寫入
{ "presets": [ "es2015" ] } 然后在當前目錄打開cmd，
運行命令 webpack
如果出現綠色的，證明成功了
然后去bin目錄里面找到app.bundle.js發現里面下面會有這段代碼
function(module, exports) { "use strict"; var a = 111; var b = 222; var xxx = function xxx(c, d) { return c * d; }; console.log(xxx(a, b)); 證明轉碼成功~~~~
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持武林網。
新聞熱點
疑難解答
