如何配置aurelia.json为CDN构建?

时间:2017-05-24 22:42:36

标签: aurelia aurelia-cli

我想构建我的项目,以便可以从CDN加载。

所以在我的页面上我会有类似的东西:

<body aurelia-app="main"> <script src="https://somecdn.com/scripts/vendor-bundle-a2d1fde206.js" data-main="aurelia-bootstrapper"></script> </body>

我想我需要更改baseDir值,但我不知道是什么。

1 个答案:

答案 0 :(得分:0)

我创建了这些手动功能,以便在我"something".map({ String($0) })

的构建过程中更新我的所有引用
build.js

然后更新构建的gulp任务以执行这些新功能并导入// this function needs to run BEFORE writeBundles // so all the img src URLs can be prepended with the correct cdnUrl before being bundled function replaceSourceCdnUrl() { if (!cdnUrl) return Promise.resolve(); return gulp.src("src/**/*.*") // find img src attributes with either single or double quotes .pipe(replace(/img.*src=["']([^\\\"]+).*/g, function(match, p1) { return (p1.indexOf(cdnUrl) > -1) ? match : match.replace(new RegExp(p1, 'g'), url.resolve(cdnUrl, p1)); })) // find img src.bind attributes with single quotes, to append double quoted cdn url .pipe(replace(/img.*src.bind='([^\\\"]+).*/g, function(match, p1) { return (p1.indexOf(cdnUrl) > -1) ? match : match.replace(new RegExp(p1, 'g'), `"${cdnUrl}" + ${p1}`); })) // find img src.bind attributes with double quotes, to append single quoted cdn url .pipe(replace(/img.*src.bind="([^\\\"]+).*/g, function(match, p1) { return (p1.indexOf(cdnUrl) > -1) ? match : match.replace(new RegExp(p1, 'g'), `'${cdnUrl}' + ${p1}`); })) .pipe(gulp.dest("src/")); } function replaceCssCdnUrl() { if (!cdnUrl) return Promise.resolve(); return gulp.src("css/**/*.*") // find url values in css files .pipe(replace(/url\(["'](.*)["']/g, function(match, p1) { return (p1.indexOf(cdnUrl) > -1) ? match : match.replace(new RegExp(p1, 'g'), url.resolve(cdnUrl, p1)); })) .pipe(gulp.dest("css/")); } // update the index file BEFORE AND AFTER writeBundles // as the aurelia-cli.bundle searches for the exact output name when updating the revision bundle // however it then uses path.posix.join() to update the index script src // causing the cdnUrl to be updated with only 1 slash, i.e. http:/ function replaceIndexCdnUrl() { if (!cdnUrl) return Promise.resolve(); // https://www.npmjs.com/package/gulp-replace#regex-replace-with-function-callback // regex - https://stackoverflow.com/a/17190290/5954805 let outputDir = project.build.targets[0].output; let scriptRegex = new RegExp(`script.*src=["']([^\\\"]*${outputDir}*).*`, "g"); return gulp.src(project.build.targets[0].index) // find script src attribute .pipe(replace(scriptRegex, function(match, p1) { // https://nodejs.org/api/path.html#path_windows_vs_posix let posixPath = path.posix.join(cdnUrl, outputDir); let resolvedPath = url.resolve(cdnUrl, outputDir); return (p1.indexOf(cdnUrl) > -1) ? match : match.replace(new RegExp(posixPath, 'g'), resolvedPath).replace(p1, resolvedPath); })) //find link shortcut favicon .pipe(replace(/<link(?=.*rel="shortcut icon".*).*href=["']([^\\\"]+).*/g, function(match, p1) { return (p1.indexOf(cdnUrl) > -1) ? match : match.replace(new RegExp(p1, 'g'), url.resolve(cdnUrl, p1)); })) .pipe(gulp.dest(".")); } path依赖项

url