Question

我尝试将github.com/sherweb/ng2-materialize添加到github.com/angular/quickstart并进行以下更改

"materialize-css": "",
"mdi": "",
"jQuery": "",
"ng2-materialize": "",
//in Package.json 'dependencies' and 'devDependencies'

systemjs.config.js Image, code below

  'jquery':                    'npm:jquery',
  'materialize-css':           'npm:materialize-css',
  'mdi':                       'npm:mdi',
  'ng2-materialize':           'npm:ng2-materialize',

请检查组件和模块image here, code below的组件和模块

成分</ P>

import { MaterializeModule } from 'ng2-materialize';

模块

@Component({   selector: 'my-app',   template: `
             <h1>Hello {{name}}</h1>
             <div class="card-panel teal lighten-2">This is a card panel with a teal lighten-2 class</div>
            `, }) export class AppComponent  { name = 'Angular'; }

但是我收到了错误并没有加载

[0] 1:10:56 PM - Compilation complete. Watching for file changes
[1] 17.02.26 13:10:57 200 GET /main.js
[1] 17.02.26 13:10:57 304 GET /@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js
[1] 17.02.26 13:10:57 200 GET /app/app.module.js
[1] 17.02.26 13:10:57 304 GET /@angular/compiler/bundles/compiler.umd.js
[1] 17.02.26 13:10:57 304 GET /@angular/core/bundles/core.umd.js
[1] 17.02.26 13:10:57 304 GET /@angular/platform-browser/bundles/platform-browser.umd.js
[1] 17.02.26 13:10:57 200 GET /app/app.component.js
........
[1] 17.02.26 13:10:57 404 GET /node_modules/ng2-materialize/

如果没有正确地实现其加载，它不会仅仅接收外部物化设计模块，它也会进行NPM启动 - 除了上面没有错误

Answer 1

我遇到了同样的问题。作为解决方法，您可以使用以下代码

文件：systemjs.config.js

var packages = {
    ...
    'ng2-materialize': {
        main: 'dist/index.js'
    }
    ...
};

var paths = {
    'npm:': 'node_modules/'
};

map = {
...
    'ng2-materialize': 'npm:ng2-materialize'
...
}

var ngMaterializePackageNames = [
        'button',
        'card',
        'checkbox',
        'collapsible',
        'dropdown',
        'input',
        'navbar',
        'parallax',
        'progress',
        'radio-button',
        'icon',
        'select',

        'sidenav',
        'sidenav/sidenav-collapsible',
        'sidenav/sidenav-divider',
        'sidenav/sidenav-header',
        'sidenav/sidenav-link',
        'sidenav/sidenav-subheader',

        'spinner',
        'textarea',
        'tooltip',

        'toast',
        'toast/services'
  ];

 function packMaterialize(pkgName) {
        packages['ng2-materialize/dist/'+pkgName] = { main: 'index.js', defaultExtension: 'js' };
  }

ngMaterializePackageNames.forEach(packMaterialize);

var config = {
        map: map,
        paths: paths,
        packages: packages
 };

System.config(config);

无法将ng2-materialize添加到github.com/angular/quickstart

1 个答案: