1. 程式人生 > >gulp-babel入坑

gulp-babel入坑

1、根據github上指導

https://github.com/babel/gulp-babel

$ npm install --save-dev [email protected] babel-core babel-preset-env
$ npm install --save-dev @babel/plugin-transform-runtime 
$ npm install --save @babel/runtime 

配置gulpfile.js

const gulp = require('gulp');
const babel = require('gulp-babel');
const babelenv = require('babel-preset-env');

gulp.task('default', () =>
    gulp.src('src/app.js')
        .pipe(babel({
            presets: ["@babel/env"]
        }))
        .pipe(gulp.dest('dist'))
);

執行gulp default報錯

解決: cnpm install  --save-dev gulp

-------------------------------------------------------------------------------------------------------------------------------------------------------------------------

再次執行gulp default報錯

解決:建立babelrc檔案 

----------------------------------------------------------------------------------------------------------------------------------------------------------------------

再次執行gulp default報錯

解決:修改gulpfile.js

const gulp = require('gulp');
const babel = require('gulp-babel');
const babelenv = require('babel-preset-env');

gulp.task('default', () =>
	gulp.src('src/app.js')
		.pipe(babel({
			presets: [babelenv]
		}))
		.pipe(gulp.dest('dist'))
);