Angular Universal："项目在工作区中找不到。"

Question

我正在尝试将我的Angular项目转换为与Angular Universal（https://universal.angular.io/）兼容。我正在按照此教程进行操作：https://github.com/angular/angular-cli/wiki/stories-universal-rendering。我卡在第3步的末尾（构建包）。我的项目名称是"fundercat"。当我尝试运行时：

ng run fundercat:server

我收到了错误信息：

Project 'dist/fundercat' could not be found in workspace.

按照教程，我修改了app.module.ts中的以下行：

@NgModule({
  imports: [
    // Modified this line:
    BrowserModule.withServerTransition({appId: 'fundercat'}),

我在 angular.json 文件中添加了以下内容：

{
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "version": 1,
    "newProjectRoot": "projects",
    "projects": {
        "fundercat": {
            "root": "",
            "sourceRoot": "src",
            "projectType": "application",
            "architect": {
                ...
                // added this block:
                "server": {
                    "builder": "@angular-devkit/build-angular:server",
                    "options": {
                        "outputPath": "dist/fundercat",
                        "main": "src/main.server.ts",
                        "tsConfig": "src/tsconfig.server.json"
                    }
                }

有什么想法是我做错了吗？

- americanknight

---

“dist/fudercat” 项目在工作区中找不到。fudercat 是正确的吗？ - Fateme Fazli

你将输出路径指定为“dist/fundercat”，但错误提示为“dist/fudercat”？请检查是否有拼写错误，你粘贴的代码似乎没问题。 - Kody

好发现！那是我在报告错误时犯的错。我确认了我的代码中没有拼写错误。 - americanknight

请问您能否检查一下 "outputPath": "dist/server" 这段代码吗？ - Fateme Fazli

如何进行检查？教程显示应该设置为 "outputPath": "dist/your-project-name-server",，因此我将其设置为 "outputPath": "dist/fundercat",。 - americanknight

嗯，我完全困惑了，但是我不再收到错误消息“在工作区中找不到项目'dist/fundercat'”。我猜我可能在仔细检查是否有错别字时无意中修复了某些东西。奇怪。然而，我现在收到错误消息“ERROR in src/server.ts(5,42): error TS2307: Cannot find module '../dist/ngfactory/src/app/app.server.module.ngfactory'。”我想我应该为此发布一个新问题。 - americanknight

Answer 1

请检查您的项目名称是否为fundercat，方法是查看package.json文件中的名称。如果名称不是fundercat，则必须在命令中使用该名称来构建服务器。例如，如果您的项目实际上被命名为FunderCat，则需要运行ng run FunderCat:server来运行服务器。

当我尝试将angular universal添加到angular-tour-of-heroes项目中时，我遇到了类似的问题。文档措辞让人觉得“my-project”是一种特殊的angular cli命令，用于运行服务器。但实际上，“my-project”指的是您正在工作的项目的名称。因此，在教程项目中，我必须运行ng run angular-tour-of-heroes:server而不是ng run my-project:server来运行服务器。

- i.Con

---

这正是我的问题所在。谢谢！我的 package.json 文件中显示的 name 属性是 'client'，但我创建的项目名称实际上是 'Client'。 - DriLLFreAK100