标签: systemjs

我有一个要进行单元测试的组件，但我不断收到这些错误，具体取决于我的导入语句：

Error: Cannot resolve all parameters for 'MyComponent'(undefined, FormBuilder).

TypeError: Cannot read property 'toString' of undefined

我的组件需要 2 个参数，一个是 FormBuilder，一个是自定义服务，必须注入：

import {MyService} from '../';

@Component({
    ...,
    providers: [MyService]
})
class MyComponent {
    constructor(service: MyService, fb: FormBuilder) { ... }
    ...
}

我的单元测试设置如下：

import {MyComponent} from './';
import {MyService} from '../';

describe('Component: MyComponent', () => {

    let builder: TestComponentBuilder;

    beforeEachProviders(() => [
        MyService,
        MyComponent
    ]);

    beforeEach(inject([TestComponentBuilder], function (tcb: TestComponentBuilder) {
        builder = tcb;
    }));

    it('should inject the component', inject([MyComponent],      
        (component: MyComponent) …

这是https://github.com/systemjs/builder/issues/611的交叉帖子

我正在尝试使用systemjs-builder 0.15.16 buildStatic方法捆绑我的Angular 2 rc 1应用程序.角度组件具有视图以及脚本外部的一个或多个样式表.它们以两种方式之一在@Component元数据中引用

使用绝对路径:

@Component({
  templateUrl: 'app/some.component.html',
  styleUrls:  ['app/some.component.css']
})

使用现在推荐的相对路径:

@Component({
  moduleId: module.id,
  templateUrl: 'some.component.html',
  styleUrls:  ['some.component.css']
})

我的应用程序使用相对路径,事情一直很好.今天我决定使用systemjs-builder's buildStatic.每当存在相对路径时,生成的文件都会抛出404错误,因为浏览器正在取localhost/some.component.html而不是localhost/app/some.component.html.下面是我的gulpfile.js的相关部分

var appDev = 'dev/';
var appProd = 'app/';
var typescript = require('gulp-typescript');
var tsProject = typescript.createProject('tsconfig.json');
var Builder = require('systemjs-builder');
var sourcemaps = require('gulp-sourcemaps');

gulp.task('build-ts', function () {
    return gulp.src(appDev + '**/*.ts')
        .pipe(sourcemaps.init())
        .pipe(typescript(tsProject))
        .pipe(sourcemaps.write())
        .pipe(gulp.dest(appProd));
});
gulp.task('bundle',['build-ts'], function() {

    var …

我有一个带有typescript和systemjs的角度两个应用程序.

我的应用程序只有800kb,只需4秒即可完成仅包含文本的页面.

我所有的js和css都是小/缩小的,我总共有11个请求,几乎没有任何图像

所有图像都被压缩并在cdn firebase中.

我使用firebase托管并使用cloudflare进行ssl和性能.

有没有人在负载和缓存方面遇到较差的angular2性能.

我没有在速度方面得到任何缓存改进.

下面是文件和加载时间的屏幕截图:

这是速度测试结果:https://www.webpagetest.org/result/161205_0H_S4H/

加载请求:17(参见下面加载网络选项卡的屏幕抓取)

假设我有一个网站，其中包含多个标签，并使用react.js构建，每个标签包含大量数据。通常，Webpack捆绑包会将应用程序反应为一个捆绑包，但是如果您从不访问其中一个选项卡，这将浪费资源。是否有可能将它分成单独的捆绑包，而不必重新捆绑react core和react DOM，然后根据请求调用这些额外的静态模块？

我愿意接受不同的建议-webpack，systemjs等。

我目前正在尝试使用Windows身份验证运行Angular 4应用程序.我已成功运行匿名身份验证,但不是Windows身份验证.一旦我将其切换到Windows身份验证,页面就会失败.我得到的第一个错误是:

(index):38 Error: Fetch error: 401 Unauthorized
  Instantiating http://localhost:1264/app/main.js
  Loading app
    at http://localhost:1264/node_modules/systemjs/dist/system.src.js:1500:13 [<root>]
    at Zone.run (http://localhost:1264/node_modules/zone.js/dist/zone.js:125:43) [<root> => <root>]
    at http://localhost:1264/node_modules/zone.js/dist/zone.js:760:57 [<root>]
    at Zone.runTask (http://localhost:1264/node_modules/zone.js/dist/zone.js:165:47) [<root> => <root>]
    at drainMicroTaskQueue (http://localhost:1264/node_modules/zone.js/dist/zone.js:593:35) [<root>]
    at <anonymous> [<root>]

讨厌.但我有点理解它.SystemJs在Systemjs.config.js文件的packages部分中加载了main.js:

    packages: {
  app: {
    main: './main.js',
    defaultExtension: 'js'
  },

所以问题与此有关.我在某个地方读到要解决这个问题,我必须添加更多属性,如下所示:

packages: {
      app: {
        main: './main.js',
        defaultExtension: 'js',
        format: 'register',
        scriptLoad: true
      },

格式和scriptLoad属性似乎让我通过未经授权的标签,但现在我有另一个问题.它现在给我以下错误:

Uncaught Error: Module name "@angular/platform-browser-dynamic" has not been loaded yet for context: _. Use require([])
http://requirejs.org/docs/errors.html#notloaded
    at F …

我正在尝试在system.config.js文件中包含指向特定NPM软件包“ Angular Calendar ” 的unpkg链接，以便我可以在服务器上运行我的站点而无需每次构建。

我不知道如何找到链接。NPM软件包示例站点上的system.config.js文件显示它引用了npm，在我看来这是本地的。我已经尝试过了，但是没有用。

 'angular-calendar': 'npm:angular-calendar@0.21.3/dist/umd/angular-calendar.js',

我只是收到一条错误消息，指出错误加载...为“角度日历”

有任何想法吗？我在正确地看问题吗？我正在尝试在服务器上运行我的网站，而不进行构建。因此，我需要链接到system.config.js中的所有依赖项。我不知道如何链接到第三方软件包。我了解，如果是NPM软件包，则存在unpgk链接。我只是不知道如何找到它。

谢谢

SystemJS可以指定从导入的文件中呈现的内容类型:

• CSS System.import('my/file.css!')
• 图片 System.import('some/image.png!image')
• JSON System.import('some/data.json!').then(function(json){})
• 文本 System.import('some/text.txt!text').then(function(text) {})

(来源)

使用SystemJS,从附加类型的文件导入,会在Webstorm中出错.
所以当我这样做时:

import template from './404.template.html!text';

意思是我需要纯文本的html文件,Webstorm显示错误说:

无法解析文件'404.template.html!text'

在我的所有项目文件结构树中显示红色下划线.

我怎样才能得到Webstorm只能解决部分之前的!？

我正在使用Angular2和TypeScript在Visual Studio 2015中开发Web应用程序.我正在使用Gulp生成分布式缩小文件.使用Angular2,我看到,没有必要使用Visual Studio或Gulp来转换TypeScript,因为SystemJs在导入模块时会这样做.js

现在的问题是:

SystemJs如何处理缩小,丑化等问题？

System.import('app/main').then(null, console.error.bind(console));

我如何缩小或丑化这个？

我有一个非常基本的config.js文件,按预期工作,只要它部署在根URL下.这是示例config.js文件:

System.config({
  //use typescript for compilation
  transpiler: 'typescript',
  //typescript compiler options
  typescriptOptions: {
    emitDecoratorMetadata: true
  },
  //map tells the System loader where to look for things
  map: {
      app: "./src",
  },
  //packages defines our app package
  packages: {
    app: {
      main: './app.ts',
      defaultExtension: 'ts'
    }
  }
});

只要从根路径加载此文件<script src="/config.js">并且位置为
http://localhost/config.js和http://localhost/src/app.ts,它一切正常.

我现在正试图将config.js文件移动到更深的目录并加载它,如:<script src="/a/b/c/d/e/config.js">,但如果我这样做,那么我需要硬编码config.js文件本身的路径,如:

 //map tells the System loader where to look for things
  map: {
      app: …