Question

我有角肥皂应用程序，我想实现它AOT编译，问题是我得到错误像 - 错误：找不到模块'./components/home/home.module.ngfactory'。

我正在做“node_modules / .bin / ngc”-p tsconfig-aot.json，然后构建供应商和webpack并启动应用程序，在构建或创建编译aot文件夹时没有错误，我认为问题在于加载程序在主应用程序中寻找ngfactory文件，而不是编译一个。任何人都可以解释如何告诉加载器从aot文件夹中获取ngfactory文件，我试图在我的主应用程序主文件夹中放置家庭组件的ngfactory文件，它给出了导入的其他错误在它，但它证明它在主文件夹中寻找ngfactory。有我的tsconfig-aot.json

{
"compilerOptions": {
    "target": "es5",
    "module": "es2015",
    "moduleResolution": "node",
    "sourceMap": true,
    "noImplicitAny": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [ "es6", "dom" ],
    "suppressImplicitAnyIndexErrors": true
},
"exclude": [
    "ClientApp/boot-client.ts",
    "node_modules",
    "wwwroot"
],
"angularCompilerOptions": {
    "genDir": "aot",
    "entryModule": "USWebTools.Web/ClientApp/app/app.module#AppModule",
    "skipMetadataEmit": true
}

和webpack config

    const path = require('path');
const webpack = require('webpack');
const merge = require('webpack-merge');
const CheckerPlugin = require('awesome-typescript-loader').CheckerPlugin;
const ngToolsWebpack = require('@ngtools/webpack');
var helpers = require('./helpers');

module.exports = () => {
    const isDevBuild = process.env.NODE_ENV !== "production"

// Configuration in common to both client-side and server-side bundles
const sharedConfig = {  
    stats: { modules: false },
    context: __dirname,
    resolve: { extensions: ['.js', '.ts'] },
    output: {
        filename: '[name].js',
        publicPath: '/dist/' // Webpack dev middleware, if enabled, handles requests for this URL prefix
    },
    module: {
        rules: [
            { test: /\.html$/, use: 'html-loader?minimize=false' },
            { test: /\.css$/, use: ['to-string-loader', 'css-loader'] },
            { test: /\.(png|jpg|jpeg|gif|svg)$/, use: 'url-loader?limit=25000' }
        ].concat(isDevBuild ? [
            { test: /\.ts$/, include: /ClientApp/, use: ['awesome-typescript-loader?silent=true', 'angular2-template-loader'] }
        ] : [
                { test: /\.ts$/, loaders: ['@ngtools/webpack'] }
            ])
    },
    plugins: [
        new CheckerPlugin()
    ]
};

// Configuration for client-side bundle suitable for running in browsers
const clientBundleOutputDir = './wwwroot/dist';
const clientBundleConfig = merge(sharedConfig, {
    entry: { 'main-client': './ClientApp/boot-client.ts' },
    output: { path: path.join(__dirname, clientBundleOutputDir) },
    plugins: [
        new webpack.DllReferencePlugin({
            context: __dirname,
            manifest: require('./wwwroot/dist/vendor-manifest.json')
        })
    ].concat(isDevBuild ? [
        // Plugins that apply in development builds only
        new webpack.SourceMapDevToolPlugin({
            filename: '[file].map', // Remove this line if you prefer inline source maps
            moduleFilenameTemplate: path.relative(clientBundleOutputDir, '[resourcePath]') // Point sourcemap entries to the original file locations on disk
        })
    ] : [
            new ngToolsWebpack.AotPlugin({
                tsConfigPath: './tsconfig-aot.json',
                entryModule: helpers.root('USWebTools.Web/ClientApp/app/app.module#AppModule')
            }),
            // Plugins that apply in production builds only
            new webpack.optimize.UglifyJsPlugin({
                beautify: false,
                comments: false,
                compress: {
                    screw_ie8: true,
                    warnings: false
                },
                mangle: {
                    screw_ie8: true
                }
            })

        ])
});

return [clientBundleConfig];

找不到ngfactory，AOT webpack angular 2

0 个答案: