babel的作用及使用

babel的作用

babel是一個node命令行工具,它的作用是對我們源代碼進行轉碼(把es6=>es5)

babel的使用步驟:

  • 安裝相關的包: @babel/core babel的核心功能 @babel/cli 提供babel命令行的能力 -D安裝
  • 轉碼配置 package.json 中的script babel 目標文件/文件夾 -o或者-d(o用於轉碼文件,d用於轉碼文件夾) 編譯之後的文件/文件夾
  • babel官網(https://www.babeljs.cn/) 查看各個模塊對應的插件
  • 配置plugins: 針對不同的es6語法提供的插件(1. 命令行的使用方式 2. 配置文件的使用方式)-D
  • 例:package.json中的script標籤配置(轉文件夾下的es6源碼):
  • babel ./src -d ./build --plugins @babel/plugin-transform-block-scoping
  • 命令行 package.json中的script 配置文件 .babelrc文件 {}
  • 預設presets: @babel/preset-env 包含了插件,.babelrc文件中配置 -D
  • 使用@babel/polyfill 用於解決es6語法中一些新增方法(非新語法問題)的轉義。直接require()引入 -S
  • 使用@babel/runtime 該包是用來解決轉碼的時候生成的helper函數(輔助函數)引用混亂的問題。-S
  • 配合@babel/plugin-transform-runtime插件使用使用@babel/plugin-transform-runtime 該包能夠保證我們正常的引入@babel/runtime這個包。-D .babelrc文件中插件配置
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章