Aurelia 捆绑
在本章中，您将学习如何在 Aurelia 框架中使用捆绑。
第 1 步-安装先决条件
您可以通过在
命令提示符中运行以下命令来安装
aurelia-bundler。
C:\Users\username\Desktop\aureliaApp>npm install aurelia-bundler--save-dev
如果你没有安装 gulp，你可以通过运行这个代码来安装它。
C:\Users\username\Desktop\aureliaApp>npm install gulp
您也可以从
npm 安装
require-dir 包。
C:\Users\username\Desktop\aureliaApp>npm install require-dir
第 2 步-创建文件夹和文件
首先，在应用根目录下创建
gulpfile.js 文件。
C:\Users\username\Desktop\aureliaApp>touch gulpfile.js
您将需要
build 文件夹。在此目录中，添加另一个名为
tasks 的文件夹。
C:\Users\username\Desktop\aureliaApp>mkdir build
C:\Users\username\Desktop\aureliaApp\build>mkdir tasks
您需要在
tasks 文件夹中创建
bundle.js 文件。
C:\Users\username\Desktop\aureliaApp\build\tasks>touch bundle.js
第 3 步-吞咽
使用
gulp 作为任务运行器。您需要告诉它运行
build\tasks\bundle.js 中的代码。
gulpfile.js
require('require-dir')('build/tasks');
现在，创建您需要的任务。此任务将使用应用程序，创建
dist/appbuild.js 和
dist/vendor-build.js 文件。捆绑过程完成后，
config.js 文件也将更新。您可以包含要注入和缩小的所有文件和插件。
bundle.js
var gulp = require('gulp');
var bundle = require('aurelia-bundler').bundle;
var config = {
force: true,
baseURL: '.',
configPath: './config.js',
bundles: {
"dist/app-build": {
includes: [
'[*.js]',
'*.html!text',
'*.css!text',
],
options: {
inject: true,
minify: true
}
},
"dist/vendor-build": {
includes: [
'aurelia-bootstrapper',
'aurelia-fetch-client',
'aurelia-router',
'aurelia-animator-css',
],
options: {
inject: true,
minify: true
}
}
}
};
gulp.task('bundle', function() {
return bundle(config);
});
命令提示符会在捆绑完成时通知我们。
