Generating the new application

First we’ll rename our project in angular.json temporarily, so we can create another project with the same name. Let’s rename our project to triviatmp in angular.json

Next, let’s generate a new one -

ng generate application --name=trivia

This would generate a new project under /projects/trivia and create a corresponding section in angular.json. Let’s the /projects/trivia/src with our /src folder, and then replace the /projects/trivia-e2e/src with contents of /e2e.

Next, we modify angular.json, project trivia to match triviatmp (including styles, assets, serviceworker, dev build configuration), but keeping the folder paths the same. Let’s try it out -

ng serve

Note: I did have some incorrect import paths that I needed to fix.

Remove the tsconfigs and typings from inside the projects/trivia/src folder as they are now at the project/trivia level.

For unit testing

I also had to modify the jest setting in package.json (path to setup and tsconfig.spec), had to move the setup-jest out of src and modify the path to mocks.

For e2e testing

Simply remove protractor.conf.js from root folder and then use command “ng e2e trivia-e2e”

Trivia project folder structure -