直接附上解決的方法:
1.在對應的目錄安裝:
如果沒有安裝gulp,先安裝gulp
//全局安裝gulp
npm install -g gulp
//項目中安裝gulp
npm install --save-dev gulp
如果已經安裝gulp,可無視上面直接安裝下面.
npm install gulp-babel --save-dev
npm install @babel/core@^7.0.0 --save-dev
npm install babel-preset-env --save-dev
2.在項目目錄新建文件
.babelrc
{
"presets": ["env"]
}
3.如果沒有gulpfile.js,新建這個文件,複製下面的代碼:
// 獲取 gulp
var gulp = require('gulp');
// 獲取babel模塊
var babel = require('gulp-babel');
/*這裏的babal是任務名,可以修改爲其他turn ,change 都行,執行的時候在命令行輸入 gulp turn 或者 gulp change就行了*/
gulp.task("babel", function () {
return gulp.src("./src/*.js")// ES6 源碼存放的路徑
.pipe(babel())
.pipe(gulp.dest("dist")); //轉換成 ES5 存放的路徑
});
4.在命令行輸入 gulp babel 就能將es6轉成es5啦
下面是例子:
一.例子的目錄:
package.json 的內容
.babelrc 文件的內容
src中 test.js的內容:(使用了es6的箭頭函數)
命令行輸入:
最後在dist目錄輸出test.js,內容如下:
最後爲新手們再提一下:
package.json 怎麼出現的鴨,爲什麼我沒有node_modules這個目錄的呢?是自己創建的嗎?
要先安裝node.js,安裝完之後在demo的目錄裏輸入npm init 看不到沒關係,無腦回車就好了