快捷導(dǎo)航

詳解webpack es6 to es5支持配置

更新時(shí)間：2017年05月04日 10:24:32 作者：三寸蠟筆

這篇文章主要介紹了詳解webpack es6 to es5支持配置，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧

1. 安裝webpack

npm install webpack --save-dev

2. 安裝babel 實(shí)現(xiàn) ES6 到 ES5

npm install --save-dev babel-core babel-preset-es2015

3.安裝 babel-loader

 npm install --save-dev babel-loader

webpack.config.js完整配置

module.exports = {
  entry: './src/js/app.js',
  output: {
    path: './dest',
    filename: 'app.bundle.js',
  },
  module: {
    loaders: [{
      test: /\.js$/,
      exclude: /node_modules/,
      loader: 'babel-loader',
    }]
  },
  babel: {
   presets: ['es2015']
  },
}

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

詳解webpack 配合babel 將es6轉(zhuǎn)成es5 超簡(jiǎn)單實(shí)例

相關(guān)文章

js中json處理總結(jié)之JSON.parse
parse是解析json數(shù)據(jù)多種方法中的其中一種。這篇文章主要介紹了js中json處理總結(jié)之JSON.parse,需要的朋友可以參考下
2016-10-10
JS獲取浮動(dòng)(float)元素的style.left值為空的快速解決辦法
這篇文章主要介紹了JS獲取浮動(dòng)(float)元素的style.left值為空的快速解決辦法,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2017-02-02
JS繪圖Flot如何實(shí)現(xiàn)動(dòng)態(tài)可刷新曲線圖
這篇文章主要介紹了JS繪圖Flot如何實(shí)現(xiàn)動(dòng)態(tài)可刷新曲線圖,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2020-10-10
前端Token?組成及生成方法示例詳解
這篇文章主要為大家介紹了前端Token?組成及生成方法示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2023-04-04
實(shí)例分析Array.from(arr)與[...arr]到底有何不同
這篇文章通過(guò)實(shí)例主要給大家分析介紹了關(guān)于Array.from(arr)與[...arr]到底有何不同的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用js具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-04-04
JavaScript——DOM操作——Window.document對(duì)象詳解
下面小編就為大家?guī)?lái)一篇JavaScript——DOM操作——Window.document對(duì)象詳解。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-07-07
js實(shí)現(xiàn)簡(jiǎn)潔的TAB滑動(dòng)門(mén)效果代碼
這篇文章主要介紹了js實(shí)現(xiàn)簡(jiǎn)潔的TAB滑動(dòng)門(mén)效果代碼,通過(guò)簡(jiǎn)單的JavaScript自定義函數(shù)動(dòng)態(tài)遍歷頁(yè)面元素實(shí)現(xiàn)tab滑動(dòng)切換的功能,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-09-09
JavaScript中new操作符的原理與實(shí)現(xiàn)詳解
你知道new嗎？你知道new的實(shí)現(xiàn)原理嗎？你能手寫(xiě)new方法嗎？不要擔(dān)心，這篇文件就來(lái)帶大家深入了解一下JavaScript中的new操作符，感興趣的小伙伴可以學(xué)習(xí)一下
2022-10-10
javascript import css實(shí)例代碼
差點(diǎn)被FF下的insertRule給帶暈了. sheet.insertRule("@import url('aa.css');",sheet.cssRules.length);
2008-07-07
Javascript 設(shè)計(jì)模式（二）閉包
本來(lái)應(yīng)該是第二章，接口，但因?yàn)殚]包實(shí)在不懂，所以先看看閉包
2010-05-05