Question

我复制https://github.com/AngularClass/angular2-webpack-starter应用。我想使用真棒，但它不起作用。

在 webpack.common.js 中，添加：

import 'jquery';
import 'bootstrap-loader';
import 'font-awesome-loader';

和 vendor.ts

{{1}}

查询和引导程序4很好，但不是很棒的图标。为什么呢？

Answer 1

我做了以下

webpack.common.js中的更改

/*
 * add to Webpack Plugins
 */
const ForkCheckerPlugin = require('awesome-typescript-loader').ForkCheckerPlugin;

...

/*
   add to rules 
*/
  rules: [

    /*
     * Typescript loader support for .ts and Angular 2 async routes via .async.ts
     * Replace templateUrl and stylesUrl with require()
     *
     * See: https://github.com/s-panferov/awesome-typescript-loader
     * See: https://github.com/TheLarkInn/angular2-template-loader
     */
    {
      test: /\.ts$/,
      loaders: [
        '@angularclass/hmr-loader?pretty=' + !isProd + '&prod=' + isProd,
        'awesome-typescript-loader',
        'angular2-template-loader'
      ],
      exclude: [/\.(spec|e2e)\.ts$/]
    },
  ],

  /*
    In the plugins section ad
  */
  plugins: [
     ...
  /*
   * Plugin: ForkCheckerPlugin
   * Description: Do type checking in a separate process, so webpack don't need to wait.
   *
   * See: https://github.com/s-panferov/awesome-typescript-loader#forkchecker-boolean-defaultfalse
   */
  new ForkCheckerPlugin(),
  ...
  ]

在组件中我包含font-awesomem然后

@Component({
    selector:       'intro',
    template:    template
    styles:         [require('../../assets/css/font-awesome/css/font-awesome.min.css')        ]
})

如何使用angular2-webpack真棒

1 个答案: