带有Webpack的Angular 4：每个块中的表单模块

Question

我正在使用Angular 4和webpack作为捆绑程序来开发应用程序。 除了捆绑与forms.es5.js有关的所有内容之外，其他所有方法都工作正常。 不幸的是，这个模块被打包到正在创建的每个块中。

我如何告诉webpack将该模块放在块中，因为它已经在main.bundle.js中了？

这是我的webpack配置的相关部分：

module.exports = {
    "entry": {
        "main": [
            "./src/main.ts"
        ],
        "polyfills": [
            "./src/polyfills.ts"
        ],
        "vendor": [
            "./src/vendor.ts"
        ]
    },
    "resolve": {
        "extensions": [
            ".ts",
            ".js"
        ],
        "modules": [
             "./node_modules",
        ],
        "symlinks": true
    },
    "resolveLoader": {
        "modules": [
            "./node_modules",
        ]
    },
    "output": {
        "path": path.join(process.cwd(), "dist"),
        "publicPath": "/assets/",
        "filename": "[name].bundle.js",
        "chunkFilename": "[id].chunk.js"
    },
    "module": {
        "rules": [
            {
                "enforce": "pre",
                "test": /\.js$/,
                "loader": "source-map-loader",
                "exclude": [
                    /\/node_modules\//
                ]
            },
            {
                 "test": /\.html$/,
                "loader": "raw-loader"
            },
            {
                "test": /\.ts$/,
                "loader": "@ngtools/webpack"
            },
            {
                "test": /\.css$/,
                "use": [ 'style-loader', 'css-loader' ]
            },
            {
                "test": /\.(jpg|png|webp|gif|otf|ttf|woff|woff2|ani)$/,
                "loader": "url-loader?name=[name].[hash:20].[ext]&limit=10000"
            }
        ]
    },
    "plugins": [
        new ProvidePlugin({
            _: 'lodash'
        }),
        new ContextReplacementPlugin(/moment[\/\\]locale$/, /de/),
        new NoEmitOnErrorsPlugin(),
        new ProgressPlugin(),
        new GlobCopyWebpackPlugin({
            "patterns": [
                "assets"
            ],
            "globOptions": {
                "cwd": path.join(process.cwd(), "src"),
                "dot": true,
                "ignore": "**/.gitkeep"
            }
        }),
        new HtmlWebpackPlugin({
            "template": "./src/index.html",
        }),
        new HtmlWebpackPlugin({
            "template": "./src/faq.html",
            "filename": "./faq.html",
        }),
        new HtmlWebpackPlugin({
            "template": "./src/terminvereinbarung.html",
            "filename": "./terminvereinbarung.html",
        }),
        new HtmlWebpackPlugin({
            "template": "./src/filialsuche.html",
            "filename": "./filialsuche.html",
        }),
        new HtmlWebpackPlugin({
            "template": "./src/suche.html",
            "filename": "./suche.html",
        }),
        new HtmlWebpackPlugin({
            "template": "./src/dividendenrechner.html",
            "filename": "./dividendenrechner.html",
        }),
        new CommonsChunkPlugin({
            name: ['main', 'vendor', 'polyfills']
        }),
        new ExtractTextPlugin('styles.css')
    ]
};

非常感谢。

Answer 1

对于其他对此绊绊的人：问题经常出在PC面前。

问题是，我也将窗体模块导入了我的App组件以及子模块中。