我們使用Babel把ES6編譯成ES5

安裝方法：

　　　　a.先建立一個項目的工程目錄，并在目錄下邊建立兩個文件夾：src和dist

?

• • • src：書寫ES6代碼的文件夾，寫的js程序都放在這里。
    • dist：利用Babel編譯成的ES5代碼的文件夾，在HTML頁面需要引入的時這里的js文件

　　　　 ?b.寫一個index.html

　　　　c.在src寫一個index.js

　　　　d.安裝命令：

?1 npm init -y?

全局安裝?npm install -g babel-cli?

本地安裝babel-preset-es2015 和?babel-cli　?npm install --save-dev babel-preset-es2015 babel-cli?

在根目錄下新建.babelrc文件，并打開寫入代碼　　 1 { 2 "presets":[ 3 "es2015" 4 ], 5 "plugins":[] 6 }

?

簡化轉換的命令（此時轉換命令為babel src/index.js -o dist/index.js）　　　　　　　　　

　　　　　　　　　打開package.json文件，把文件修改成下面的樣子。　　　　　　　

1 { 2 "name": "es6", 3 "version": "1.0.0", 4 "description": "", 5 "main": "index.js", 6 "scripts": { 7 "build": "babel src/index.js -o dist/index.js" 8 }, 9 "keywords": [], 10 "author": "", 11 "license": "ISC", 12 "devDependencies": { 13 "babel-cli": "^6.24.1", 14 "babel-preset-es2015": "^6.24.1" 15 } 16 }

　　　　　　　　　　此時，命令為? npm run build?

?

轉載于:https://www.cnblogs.com/paradise-zzz/p/8485152.html

《新程序員》：云原生和全面數字化實踐50位技術專家共同創作，文字、視頻、音頻交互閱讀

總結

以上是生活随笔為你收集整理的es6总结(一) ——开发环境的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。