我无法在 asp.net core spas 中添加带有角度 cli 的新组件

Posted 2023-03-09

【中文标题】我无法在 asp.net core spas 中添加带有角度 cli 的新组件

【英文标题】：I can't add new component with angular cli in asp.net core spas

【发布时间】：2017-09-17 19:41:29

【问题描述】：

我想用 angular 4 和 angular cli 在 asp.net core 2.0 SPA 中添加一个新组件： p>

@angular/cli: 1.4.2

节点：8.4.0

操作系统：Linux x64

当我在组件目录上运行此命令 ng g c vehicle-form 时出现此错误：

错误：找不到新组件的 NgModule。使用 skip-import 选项跳过在 NgModule 中导入组件。 找不到新组件的 NgModule。使用 skip-import 选项跳过在 NgModule 中导入组件。

app.module.shared.ts

另外，我有 3 个文件供 app.module.ts 使用，没有一个：\：

app.module.browser.ts

app.module.shared.ts

app.module.server.ts

【问题讨论】：

Angular CLI in ASP.NET Core 2 Step By Step

请试试这个方法***.com/a/53696599/2668045应该没问题。

【参考方案1】：

您正在一个项目中使用 Angular CLI，而该项目并未考虑到 CLI，因此您必须采取一些额外的步骤。错误信息告诉你想做什么。

首先，运行ng g c vehicle-form 命令并包含--skip-import=true 选项。

然后，手动将组件声明添加到适当的应用程序模块文件中。在这种情况下，app.module.shared.ts 声明了所有其他应用程序组件。

或者，您可以运行ng g c vehicle-form 并包含--module='app.module.shared.ts'。您可能必须使用此完全限定模块文件的路径。我还没有测试过，所以准备好自己尝试一些东西。

更多关于 ng generate 组件：generate component.

更新（2018-03-01）

Microsoft 提供了一些新的 SPA 模板，用于 ASP.NET Core 2.0 应用程序。您可以在here 找到有关它们的更多详细信息。新的Angular template 包括对Angular CLI 的支持。因此，如果您熟悉 CLI，那么这应该有点像家的感觉。这意味着您可以通过ng g 命令使用这个新模板生成代码。

【讨论】：

谢谢！确认这有效：ng g c vehicle-form --module='app.module.shared.ts'。要安装 Angular CLI 并在项目的根目录中获取 .angular-cli.json，我按照以下说明操作：***.com/questions/46826352/…

【参考方案2】：

在我的情况下，问题出在 e2e 项目中。在我将我的项目从 angular 4 移动到 angular 6 之后，添加了一个新的 angular 配置文件“angular.json”而不是“angular.conf.json”。 在项目部分出现了两个项目：一个是我的“ng-app”，另一个是“ng-app-e2e”。 当我尝试执行“ng g c”命令时，我遇到了同样的错误。原因是在“ng-app-e2e”的根部分。它有空值。我将其设置为“e2e”。现在一切正常！ 尽管在“ng-app”中设置了默认项目，但仍会发生这种情况。

"projects": 
    "ng-app": 
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "prefix": "app",
      ...
    ,
    "ng-app-e2e": 
      "root": "e2e", <-- SALVATION
      "sourceRoot": "e2e",
      "projectType": "application",
      ...
    
  ,
  "defaultProject": "ng-app"  

【讨论】：

谢谢！！这是一个令人头疼的问题，您的解决方案奏效了！

【参考方案3】：

对于 ASP Net Core Angular 项目，app.module 被拆分为 3 个文件，正如您所强调的那样。 Angular CLI 必须决定在哪里添加对模块中组件的引用，因此您需要为其提供一些帮助。

ng g c moduleName --module='app.module.browser.ts'

【参考方案4】：

在 .angular-cli.json 中 部分“应用程序”将“./src”替换为“src”

“应用程序”：[ “根”：“src”， "outDir": "dist",

【参考方案5】：

ng 生成组件componentName --module=app.module

在我的项目中，我也遇到了上述错误，我尝试了这个命令，它工作正常。我认为这会对你有所帮助。

【参考方案6】：

我遇到了同样的问题，然后我意识到我不在项目的根文件夹中。

我没有工作的时候

/c/some/path/your_project/src/bla/bla/bla

但它确实有效（对我来说有效）

/c/some/path/your_project

【参考方案7】：

我在将 5 版本转换为 6 版本时遇到了同样的问题。我从github 找到了解决方案。当我从 sourceRoot 中删除 e2e 时，它​​解决了这个问题。

【参考方案8】：

如果 app.module.ts 文件不存在，则会出现此错误。请验证文件是否存在，如果不存在，请手动创建一个。

【参考方案9】：

1- 将默认 Angular 项目中的 angular.json 复制到您的 asp.net mvc 核心项目中。 2-可能需要安装npm install @angular/cli@latest --save-dev 3-打开angular.json并更改

 "root": "./ClientApp",
 "sourceRoot": "./ClientApp/src",

那么你可以使用ng g c vehicle-form