Question

我一直在努力缩小生产代码（当我在开发模式下运行webpack时，一切正常）。主要区别在于UglifyJsPlugin插件。当我使用该插件提供项目时，我在JS控制台中得到了这个：

polyfills.b0a99d4.bundle.js:5 Unhandled Promise rejection: Template parse errors:
Can't bind to 'articles' since it isn't a known property of 'feed-grid'.
1. If 'feed-grid' is an Angular component and it has 'articles' input, then verify that it is part of this module.
2. If 'feed-grid' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to suppress this message.

但是，我相信我正确地声明了我的输入（特别是因为它在没有这个插件的情况下工作）。

import { Component, Input } from '@angular/core';
import { ArticleModel } from '../../models/article.model';

@Component({
  selector: 'feed-grid',
  styleUrls: ['./feed-grid.scss'],
  template: require('./feed-grid.html')
})

export class FeedGrid {
  @Input() articles: ArticleModel[] = [];

  constructor() {}
}

我是否遗漏了这个Uglify插件的内容，可能会为此声明输入内容？我可以在任何地方找到关于验证@Input（）或输入组件属性的内容。如果这有帮助，我正在使用rc5。

谢谢，乔恩

Answer 1

模板解析没有正常工作，而且角度团队现在提供了解决他们文档的工作但是希望能够在webpack.config文件中尽快解决这个问题

htmlLoader: {
    minimize: false // workaround for ng2
  },

或

{
    test: /\.html$/,
    loader: `html?-minimize`
}

试试这个

使用mangle：false显式禁用重整。

 new webpack.optimize.UglifyJsPlugin({     
            // Mangling specific options
            mangle: false
        })

https://jsfiddle.net/vrd4nfL4/3/

Source

使用UglifyJsPlugin验证@Input装饰器

1 个答案: