Question

所以我试图为我的angular 2应用程序制作一个相当健壮的模板webpack配置文件，但是我在尝试拆分文件时遇到错误。

所以这是我得到的错误：

vendor.js：1未捕获的ReferenceError：未定义webpackJsonp（匿名函数） polyfills.js：51 Uncaught TypeError：无法读取属性＆＃39; call＆＃39;未定义的

注意：使用polyfills.js webpack实际上会生成两个不同的文件，不确定是否会发生这种情况

当尝试在MVC提供的Index.cshtml文件中加载文件时，我按顺序加载它们：vendor.js，polyfills.js，app.js

我可能会收到这些错误的任何想法？如果有一些优化，那么随便提一下

这是我的Common webpack文件

var webpack = require('webpack');
var merge = require('extendify')({ isDeep: true, arrays: 'concat' });
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var extractCSS = new ExtractTextPlugin('styles.css');
var currentEnv = process.env.ASPNETCORE_ENVIRONMENT
var currentEnvConfig = require('./webpack.' + currentEnv)

 var common =  {   
        resolve: {
        extensions: ['', '.js', '.ts']
    },
    module: {
        loaders: [
            { test: /\.ts$/, loader: 'ts-loader' },
            { test: /\.html$/, loader: 'raw-loader' },
            { test: /\.css$/, loader: currentEnv != 'dev' ?   extractCSS.extract(['css']) : 'css-loader'},
            { test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/, loader: 'file?name=assets/[name].[hash].[ext]'}
        ]
    },
    entry: {
        app: './app/main.ts',
        vendor: ['./app/vendor.ts'],
       pollfills: ['./app/polyfills.ts']
    },
    output: {
        path: 'wwwroot/dist/',
        filename: '[name].js',
        publicPath: '/dist/'
    },
    plugins: [
        new webpack.optimize.CommonsChunkPlugin(/* chunkName= */"vendor", /* filename= */"vendor.js"),
        new webpack.optimize.CommonsChunkPlugin(/* chunkName= */"polyfills", /* filename= */"polyfills.js")
        //new webpack.optimize.CommonsChunkPlugin({
        //    name: ['app', 'vendor', 'polyfills']
        //}),
    ]
};
 if (currentEnv != 'dev'){
     common = merge(common, currentEnvConfig)
 }
 module.exports = common;

和我的prod one - 测试和开发webpack配置文件目前没有任何东西，所以我没有包括

var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
const ENV = process.env.ASPNETCORE_ENVIRONMENT = process.env.ASPNETCORE_ENVIRONMENT = 'production';

module.exports = {
    plugins: [
      new webpack.NoErrorsPlugin(),
      new webpack.optimize.DedupePlugin(),
      new webpack.optimize.UglifyJsPlugin(),
      new webpack.DefinePlugin({
          'process.env': {
              'ENV': 'prod'
          }
      })
    ]
};

更新：
如果我将文件的顺序更改为此

<script src="~/dist/polyfills.js"></script>
<script src="~/dist/vendor.js"></script>
<script src="~/dist/app.js"></script>

然后我反而得到这些错误

vendor.js：12571使用类decoratorscheckReflect时需要不带反射元数据垫片 vendor.js：32248未捕获的TypeError：无法读取属性＆＃39; isDefaultChangeDetectionStrategy＆＃39;未定义的

但我的reflect-metadata中有polyfills.ts，如下所示

import 'reflect-metadata';
import 'zone.js/dist/zone';

尝试使用webpack / angular 2 / .net核心进行代码拆分时出错

0 个答案: