AngularJS网页包加载Angular Hybrid

我正在尝试设置一个角度/角度混合环境。为了启动环境,我尝试将AngularJS加载到角度环境中。

main.ts文件如下所示:

import 'zone.js/dist/zone';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { UpgradeModule } from '@angular/upgrade/static';
import { AppModule } from './scripts/legacy/app.module';

import { setAngularJSGlobal } from '@angular/upgrade/static';
import * as angular from 'angular';
setAngularJSGlobal(angular);

import { UpgradeModule } from '@angular/upgrade/static';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { AppComponent } from './app.component';

import 'angular';
import 'other_libraries';

import '../localimports';

@NgModule({
    imports: [
        BrowserModule,
        FormsModule,
        HttpModule,
        UpgradeModule
    ],
    declarations: [
        AppComponent
    ],
    providers: [

    ],
entryComponents: [

    ]
})

export class AppModule
{
    constructor(private upgrade: UpgradeModule) { }
    ngDoBootstrap()
    {
        console.log('Loading main module');
        this.upgrade.bootstrap(document.body, ['app'], { strictDi: true });
        console.log('Main module loaded');
    }
}

为了捆绑所有内容,我使用了webpack:

const path = require('path');
const webpack = require('webpack');
//const helpers = require('./helpers');

const HtmlWebpackPlugin = require('html-webpack-plugin');

const ENV = process.env.NODE_ENV = process.env.ENV = 'development';
var BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

module.exports = {
    
    entry: {
        'app': './main.ts',
    },

    output: {
        path: __dirname + '/../dist/dev',
        publicPath: '/',
        filename: '[name].bundle.js',
        chunkFilename: '[id].chunk.js'
    },

    resolve: {
        extensions: ['.ts', '.js'],
        alias: {
            'angular': path.join(__dirname, '/../lib/Angular/angular.js'),
        }
    },

    module: {
        rules: [
            {
                test: /\.ts$/,
                use: [
                    { loader: 'awesome-typescript-loader' },
                    { loader: 'angular2-template-loader' },
                ]
            },
            {
                test: /\.html$/,
                loader: 'html-loader'
            }
        ]
    },

    plugins: [
        
        new webpack.optimize.CommonsChunkPlugin({
        name: 'vendor',
        chunks: ["vendor", "app"], // any libraries common to both these bundles will end up in the 'vendor' bundle
        minChunks: 2
        }),
        */

        new webpack.SourceMapDevToolPlugin({
            "filename": "[file].map[query]",
            "moduleFilenameTemplate": "[resource-path]",
            "fallbackModuleFilenameTemplate": "[resource-path]?[hash]",
            "sourceRoot": "webpack:///"
        }),

        new HtmlWebpackPlugin({
            template: 'config/index.html',
            chunks: ['app'],
        }),

        new webpack.DefinePlugin({
            'process.env': {
                'ENV': JSON.stringify(ENV)
            }
        }),
    ]
};

问题是,当我尝试引导AngularJS库时,会出现以下错误:

core.js:6605 ERROR TypeError: angular.module is not a function
    at module_ (static.js:96)
    at UpgradeModule.bootstrap (static.js:1803)
    at AppModule.ngDoBootstrap (app.module.ts:46)
    at PlatformRef._moduleDoBootstrap (core.js:29595)
    at eval (core.js:29562)
    at ZoneDelegate.invoke (zone.js:404)
    at Object.onInvoke (core.js:28942)
    at ZoneDelegate.invoke (zone.js:403)
    at Zone.run (zone.js:164)
    at eval (zone.js:1322)
defaultErrorLogger @ core.js:6605
handleError @ core.js:6653
eval @ core.js:29658
ZoneDelegate.invoke @ zone.js:404
Zone.run @ zone.js:164
runOutsideAngular @ core.js:28871
eval @ core.js:29658
ZoneDelegate.invoke @ zone.js:404
onInvoke @ core.js:28942
ZoneDelegate.invoke @ zone.js:403
Zone.run @ zone.js:164
eval @ zone.js:1322
ZoneDelegate.invokeTask @ zone.js:438
onInvokeTask @ core.js:28929
ZoneDelegate.invokeTask @ zone.js:437
Zone.runTask @ zone.js:209
drainMicroTaskQueue @ zone.js:624
Promise.then (async)
scheduleMicroTask @ zone.js:607
ZoneDelegate.scheduleTask @ zone.js:428
Zone.scheduleTask @ zone.js:252
Zone.scheduleMicroTask @ zone.js:272
scheduleResolveOrReject @ zone.js:1312
ZoneAwarePromise.then @ zone.js:1470
bootstrapModule @ core.js:29587
eval @ main.ts:11
./main.ts @ app.bundle.js:3196
__webpack_require__ @ bootstrap:19
(anonymous) @ startup:4
(anonymous) @ startup:4
zone.js:1106 Unhandled Promise rejection: angular.module is not a function ; Zone: <root> ; Task: Promise.then ; Value: TypeError: angular.module is not a function
    at module_ (static.js:96)
    at UpgradeModule.bootstrap (static.js:1803)
    at AppModule.ngDoBootstrap (app.module.ts:46)
    at PlatformRef._moduleDoBootstrap (core.js:29595)
    at eval (core.js:29562)
    at ZoneDelegate.invoke (zone.js:404)
    at Object.onInvoke (core.js:28942)
    at ZoneDelegate.invoke (zone.js:403)
    at Zone.run (zone.js:164)

我检查了从main.ts加载angular的时间,但似乎传递到setAngularJSGlobal的angular对象没有导出正确的字段:

你知道angularJS对象有什么问题吗?