3

I'm trying to convert my existing Angular Project to work with Angular Universal (https://universal.angular.io/). I'm following this tutorial: https://github.com/angular/angular-cli/wiki/stories-universal-rendering. I'm stuck at the end of Step 3 (Building the Bundle). The name of my project is "fundercat". When I try to run:

ng run fundercat:server

I get the error:

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

Following the tutorial, I modified the following line in app.module.ts:

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

And I added the following to 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"
                    }
                }

Any idea what I'm doing wrong?

americanknight
  • 689
  • 3
  • 18
  • 37
  • ```Project 'dist/fudercat' could not be found in workspace.``` fudercat is right? – Fateme Fazli Jun 04 '18 at 20:31
  • You specify your output path as "dist/fundercat" but your error says "dist/fudercat"? Check that you have no misspellings, the code you pasted seems to be ok. – Kody Jun 04 '18 at 20:32
  • Good catch! That was my mistake in reporting the error. I verified that there's no typos in my code. – americanknight Jun 04 '18 at 20:36
  • may you check ```"outputPath": "dist/server"``` ? – Fateme Fazli Jun 04 '18 at 20:49
  • Check it in what way? The tutorial shows that it should be ```"outputPath": "dist/your-project-name-server",```, so I set it to ```"outputPath": "dist/fundercat",```. – americanknight Jun 04 '18 at 20:53
  • Um, I'm totally confused, but I'm no longer getting the error ```Project 'dist/fundercat' could not be found in workspace.```. I guess I may have unknowingly fixed something while double-checking that there were not typos. Weird. However, I'm now getting the error ```ERROR in src/server.ts(5,42): error TS2307: Cannot find module '../dist/ngfactory/src/app/app.server.module.ngfactory'.``` I guess I should post a new question for this. – americanknight Jun 04 '18 at 21:03

1 Answers1

8

Double check that fundercat is the name of your project by looking at what is listed as the name in your package.json file. If the name is something other than fundercat, you will have to use that name in the command in order to build the server. For example, if your project is actually named FunderCat then you need to run ng run FunderCat:server to run the server.

I ran into a similar issue when I tried to add angular universal to the angular-tour-of-heroes project. The way the documentation was worded made it seem like "my-project" was some kind of special angular cli command for running the server. It's not. "my-project" refers to the name of the project you're working on. So I had to run ng run angular-tour-of-heroes:server to run the server in the tutorial project instead of ng run my-project:server.

i.Con
  • 81
  • 1
  • 2
  • That was exactly the prob with mine. Thanks! The name property shown in my package.json was 'client' but the project name that i have created was actually 'Client'. – DriLLFreAK100 Mar 02 '19 at 13:42