Question

我有一个包含2个页面的ASP.NET Core网站，页面路由是通过MVC完成的，而不是Angular 2。每个页面都有自己的Angular 2＆＃34; app＆＃34;。我正在努力让这个与webpack一起使用。

如果我将两个组件引导到一个模块中，那么我会收到The selector "xxx" did not match any elements错误。但是，如果我尝试在entry中创建多个webpack.config.js，则polyfills会因为无法找到其他模块而感到不安。

我如何让它工作？这里唯一可用的选项是被迫使用Angular 2路由器并创建一个SPA吗？

这是我webpack.config.js的相关部分：

entry: {
    "polyfills": "./App/polyfills.ts",
    "vendor": "./App/vendor.ts",
    "firstapp": "./App/bootfirst.ts",
    "secondapp": "./App/bootsecond.ts"
},
resolve: {
    extensions: ['', '.ts', '.js', '.json', '.css', '.scss', '.html']
},
output: {
    path: process.cwd() + "/wwwroot",
    publicPath: "/js/",
    filename: "js/[name].js"
},

Answer 1

可悲的是，我不得不利用这种暴行来继续前进。请有人帮我找到合适的解决方案。

entry: {
    "polyfills": "./App/polyfills.ts",
    "vendor": "./App/vendor.ts",
    "app": "./App/bootfirst.ts"
    //"app": "./App/bootsecond.ts"
},
resolve: {
    extensions: ['', '.ts', '.js', '.json', '.css', '.scss', '.html']
},
output: {
    path: process.cwd() + "/wwwroot",
    publicPath: "/js/",
    filename: "js/[name].first.js"
    //filename: "js/[name].second.js"
},

Answer 2

如果您针对这两条路线有两个单独的Angular应用，那么...

ng build --prod ...（即创建生产版本）这两个应用程序分开，并将它们放置/托管在MVC应用程序中它们各自的文件夹中。此解决方案无需网络包装。

我想根据.NET MVC Route加载内容（index.html）是您已经知道如何处理的事情。因此，当各个路由命中时，它只会将特定应用加载到各个文件夹中。根据您的MVC项目和Angular应用的设置，可能需要进行一些部署调整。

带有多个角度2模块的webpack

2 个答案: