微信小程序gulp插件,解决npm包管理和babel-runtime

网友投稿 888 2022-10-11

微信小程序gulp插件,解决npm包管理和babel-runtime

微信小程序gulp插件,解决npm包管理和babel-runtime

gulp-wxa-copy-npm

微信小程序gulp插件,解决npm包管理和babel-runtime。可以使用诸如ES7,moment等。

在package.json加入"babel-plugin-transform-runtime",在babel配置的plugins加入"transform-runtime"。这样就可以直接使用Promise,Map,Symbol等。

如果想要使用async await,甚至是Decorator,具体只要参考babel配置就可以了。

Usage

In gulpfile.js

const gulp = require("gulp");const babel = require("gulp-babel");const gwcn = require('gulp-wxa-copy-npm');const sourcemaps = require('gulp-sourcemaps');gulp.task('babel', () => let knownOptions = {}; let options = minimist(process.argv.slice(2), knownOptions); //config.babel gulp.src('src/**/*.js') .pipe(sourcemaps.init()) .pipe(log('Babeling')) .pipe(babel({ "presets": [ "es2015", "stage-0" ], "plugins": [ "transform-export-extensions", "syntax-export-extensions", "transform-runtime" ] })) .pipe(gwcn(options)) .pipe(sourcemaps.write('.')) .pipe(gulp.dest(config.dest)););

在代码中:

const moment = require('moment'); //NPMconst util = require('./util');

import moment from 'moment' //NPMimport config from './config'import {fetch} from '../common'

注意项目中的代码一定要使用require('./util')或require('../common/page')这种形式。

Installation

$ npm install gulp-wxa-copy-npm --save-dev

Why

首先感谢labrador和wepy参考了其中一些代码。这2个库很优秀!但是限制了我们。我们可以自己建gulpfile来使用stylus,imagemin等。可是最大的诉求是想用NPM包管理和ES7,没有这样的一个gulp插件。所以我就做了一个。

但是自由是有代价的,很多东西你需要自己写。

Directory

|- dist|- src|- gulpfile.js\- package.json

Options

gwcn-src默认是'src'。表示的是:源目录夹名。gwcn-dest默认是'dist'。表示的是:输出目录夹名。node_modules默认是'../node_modules'。表示的是:源目录和node_modules相对路径。gwcn-log默认是false。表示的是:是否输出log。plugins。数组。

Plugin Example

const guglify = through.obj(function(file, enc, callback) { let code = file._contents.toString(enc); let result = uglify.minify(code, { fromString: true }); file._contents = new Buffer(result.code); callback(null, file);});const task_babel_release = function() { let knownOptions = {}; let options = minimist(process.argv.slice(2), knownOptions); options.plugins = [(code, destPath, {file, enc, callback}) => uglify.minify(code, { fromString: true }).code]; //{file, enc, callback} 和through的保持一致 return gulp.src(config.js) .pipe(log('Babeling')) .pipe(babel(config.babel)) .pipe(guglify) .pipe(gwcn(options)) .pipe(gulp.dest(config.dest));};

Issues

目前版本还是0.1.3,没有经过充分测试。欢迎大家提bug和pull request!

版权声明:本文内容由网络用户投稿,版权归原作者所有,本站不拥有其著作权,亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容,请联系我们jiasou666@gmail.com 处理,核实后本网站将在24小时内删除侵权内容。

上一篇:使用GDAL进行影像投影坐标、地理坐标、图上坐标的转换
下一篇:Shell脚本循环读取文件中的每一行
相关文章

 发表评论

暂时没有评论,来抢沙发吧~