systemjs-builder中的路径解析

Question

我的项目结构是这样的：

/node_modules

/client
|---/app
|   |---/app.module.ts
|   |---/main.ts
|---/systemjs.config.js
|---/index.html

/server
|---/server.js

/tools
|---/builder.js

/package.json

我用的是angular2-rc5

我使用快递服务器公开了一些目录，并将它们映射到以下路由：

/client         =>    /
/node_modules   =>    /

因此，当用户从浏览器访问“/”时，他得到的是/client/index.html文件。

在index.html上，baseUrl设置如下：

<base href="/">

系统is是这样导入的：

<script src="systemjs.config.js"></script>
<script>
  System.import('app');
</script>

在systemjs.config.js上，应用程序的映射如下：

var map = {
  'app': 'app',
  '@angular': '@angular'
}

现在，我正在尝试将我的应用程序与systemjs捆绑在一起，脚本builder.js如下所示：

var SystemBuilder = require('systemjs-builder');
var builder = new SystemBuilder();

builder.loadConfig('client/systemjs.config.js')
    .then(function(){
        var outputFile = './client/assets/js/bundle.min.js';
        return builder.buildStatic('app', outputFile, {
            minify: true,
            mangle: false,
            rollup: true
        });
    })
    .then(function() {
        console.log('bundle built successfully!');
    });

现在的问题是，我的服务器中的路由与我的项目结构不一样。因此，当我在builder.js中指定'app‘时，它实际上试图找到/app而不是/client/app

其中一项工作是在systemjs.config中为浏览器和非浏览器操作设置两个不同的映射，如下所示：

var isPublic = typeof window != "undefined";
var map = {
  'app': 'app',
  '@angular': (isPublic)? '@angular':'../node_modules/@angular'
}

但是由于我的baseURL设置为/client，所以我不能真正映射到node_modules/@angular；我必须将目录向上并定位它(即../node_modules/@angular)。但这么做向我展示了：

Error: Unable to calculate canonical name to bundle file:///usr/node_modules/@angular/platform-browser-dynamic//bundles/platform-browser-dynamic.umd.js. Ensure that this module sits within the baseURL or a wildcard path config.

我不希望node_modules和client被路由到/，这样我的最终用户就不能看到实际的路径。

现在，我如何将这个应用程序与systemjs-builder捆绑？。

Answer 1

这一错误表明：

确保此模块位于baseURL或通配符路径配置中。

显然，node_modules不能在baseURL中，所以您可以尝试为构建器配置使用第二种方法，添加paths而不是更改map

paths: {
    '@angular/': '../node_modules/@angular/'
}

顺便说一句，消息中的措辞很快就过时了，路径配置中的通配符被废弃。，现在人们应该在那里使用尾斜杠，所以'path/'是'path*'的首选方式。