javascript–如何从我的汇总捆绑包中保留bower包依赖项？

我目前正在创建一个输出单个ES6模块的凉亭包.

在为我的包构建dist时,我使用汇总将所有内部模块移动到单个模块中,仅导出一个模块.

Gulp任务：

// Bundle ES6 modules into a single file
gulp.task('bundle', function(){
return gulp.src('./src/GuacaMarkdownEditor.js', {read: false})
.pipe(rollup({
// any option supported by rollup can be set here, including sourceMap
// https://github.com/rollup/rollup/wiki/Javascript-API
format: 'es6',
sourceMap: true
}))
.pipe(sourcemaps.write(".")) // this only works if the sourceMap option is true
.pipe(gulp.dest('./dist'));
});


这一切都运行正常,但我从其他bower包导入一些依赖项,我不想与我的模块捆绑(jQuery,font-awesome).

我的问题是：如何保持捆绑我的代码并保留bower包的ES6导入语句 – 但是没有汇总将外部代码捆绑到我的包中？

例：

"use strict";
import $from 'jquery'; // dont bundle this!
import GuacaAirPopUp from './GuacaAirPopUp'; // bundle this!
export
default class GuacaMarkdownEditor {
...
}


解决方法:

您可以使用此汇总插件rollup-plugin-includepaths.

它允许您按名称导入模块,并且应该从捆绑包中排除定义模块.我在rollup.config.js中使用它：

import babel from 'rollup-plugin-babel';
import includePaths from 'rollup-plugin-includepaths';
var includePathOptiOns= {
paths: ['es6'],
include: {
'd3': './global/js/' + 'base/d3.min' // include library in es6 modules
},
external: ['d3'] // but don't bundle them into bundle.js
};
export default {
entry: './es6/entry.js',
plugins: [
includePaths(includePathOptions),
babel()
],
format: 'amd',
dest: 'build/bundle.js',
sourceMap: true
};


在es6模块中：

// not using relative path since it is handled by the plugin
import d3 from 'd3';
import other from 'otherModules';
//...


关于外部决议here的更多讨论