Skip to content

yasu-s/ng-seed-to-cli

Repository files navigation

Overview

Sample project to migrate project created with Angular Seed to Angular CLI.

System requirements

  • Node.js 8.x
  • Angular 6.x
  • Visual Studio Code 1.20 or higher
    • Extension Debugger for Chrome

Operation check

1. Download Sample

git clone git@github.com:yasu-s/ng-seed-to-cli.git

2. Installing packages

cd ng-seed-to-cli
npm install

3. Launch sample application

Launch Angular Seed

npm start

Launch Angular CLI

npm run ng:serve

NPM Script list

Angular Seed

Command Overview
npm start Execute debugging.
npm run test The unit test is executed.
npm run karma.start-debug npm run test after execution, debugging can be executed.

Angular CLI

Command Overview
npm run ng:serve Execute debugging.
npm run ng:test The unit test is executed.

Debugging with Visual Studio Code

Angular Seed

  1. npm start or npm run karma.start-debug to start.
  2. Run debugging with Attach to Chrome - Angular Seed from the debug menu of Visual Studio Code.

Angular CLI

  1. npm run ng:serve or npm run ng:test to start.
  2. Run debugging with Attach to Chrome - Angular CLI from the debug menu of Visual Studio Code.

Changes from Angular Seed

package.json

Add the following to devDependencies.

  • @angular/cli
  • @angular-devkit/build-angular
  • typescript

Add Angular CLI related files

For build

  • angular.json
  • config/ng-cli/index.html
  • config/ng-cli/main.ts
  • config/ng-cli/polyfills.ts
  • config/ng-cli/tsconfig.app.json

For test

  • angular.json
  • config/ng-cli/test.ts
  • config/ng-cli/polyfills.ts
  • config/ng-cli/tsconfig.spec.json

Angular Seed configuration file replacement

Since Angular CLI will be a build error, replace the configuration file at build time.

"fileReplacements": [
    {
        "replace": "src/client/app/shared/config/env.config.ts",
        "with": "src/client/app/shared/config/env.config.test.ts"
    }
]

Reference URL