如何在构建期间将Aurelia软件包部署到另一个目录？

Question

我正在研究Aurelia Sample应用程序,并希望将构建输出(vendor-bundle.js和app-bundle.js)部署到www-root\scripts默认scripts目录而不是默认目录.所以我尝试修改aurelia.json看起来像:

...
"testFramework": {
    "id": "jasmine",
    "displayName": "Jasmine"
  },
  "build": {
    "targets": [
      {
        "id": "web",
        "displayName": "Web",
        "output": "www-root\\scripts"
      }
    ],
    "loader": {
...

这确实导致捆绑文件输出到,www-root\scripts但是因为我为我的apllication 定义了HTTP.SYS别名,例如登陆URL是:http:// localhost/MyAlias /当我尝试浏览它试图加载的应用程序时app-bundle.js来自:http://localhost/MyAlias/www-root/scripts/app-bundle.js而不是http://localhost/MyAlias/scripts/app-bundle.js.

但是,vendor-bundle.js可以从以下位置正确下载:http://localhost/MyAlias/scripts/vendor-bundle.js

我无法找出要修改的内容,以便从正确的路径获取app-bundle.js.

很感谢任何形式的帮助.

Answer 1

您可以创建自定义gulp任务,以www-root在构建过程结束时将捆绑的应用程序复制到文件夹中.通过选择这种方法,没有必要改变build.targets在aurelia.json.

1.使用aurelia-cli生成器[文档]生成新任务.

如下所示:

aurelia_project/tasks/dist.js|ts

import * as gulp from 'gulp';
import * as project from '../aurelia.json';

export default function dist() {
    return gulp.src(project.dist.sources, { "base" : "." })
        .pipe(gulp.dest(project.dist.output));
}

2.我认为最好有一个单独的配置部分用于发布,因此您也可以添加其他文件和文件夹.

aurelia_project/aurelia.json

...

"dist": {
    "output": "www-root",
    "sources": [
        "./scripts/**/*",
        "./index.html",
        "<other_resource_to_copy>",
        ...
    ]
},

....

3.在构建过程结束时插入此新任务.

aurelia_project/tasks/build.js|ts

export default gulp.series(
    readProjectConfiguration,
    ...
    writeBundles,   
    dist // here goes our custom task
);

4.哦,它的工作原理与au run --watch以及!:)

如果您想尝试一下,我在这里有一个有效的例子.

Answer 2

如果有人来这里寻找清理 aurelia-cli 项目根目录的方法，这里有一种方法可以使用 RequireJS 或 SystemJS 加载器直接构建到您选择的位置：

1. 为输出创建一个目录，我们称之为 OUTPUT
2. 移动index.html和favicon.ico输出

3. 打开aurelia_project/aurelia.json并编辑以下内容：

   "build": {
       "targets": [
           {
               "index": "OUTPUT/index.html",
               "baseDir": "OUTPUT",
               "baseUrl": "scripts",
               "output": "OUTPUT/scripts"
           }
       ],
       ...
   }
   ...
   "platform": {
       "index": "OUTPUT/index.html",
       "baseDir": "OUTPUT",
       "baseUrl": "scripts",
       "output": "OUTPUT/scripts"
   },
   

4. 测试，au run你应该很高兴！