In this Angular CLI ng new Command chapter explains the syntax, argument and options of ng new command along with an example. so we explain all Angular CLI new Command below –
Syntax
The syntax for ng new command is as follows −
ng new <name> [options] ng n <name> [options]
ng new command creates a workspace of a given name with a default Angular Application.
It provides interactive prompts to set optional configurations. All prompts have default values to choose.
Argument
The argument for ng new command is as follows −
Sr.No. | Argument & Syntax | Description |
---|---|---|
1 | <name> | The name of the new workspace and initial project. |
Options
Options are optional parameters.
Sr.No. | Option & Syntax | Description |
---|---|---|
1 | –collection=collection | A collection of schematics to use in generating the initial app.Aliases: -c. |
2 | –commit=true|false | Initial git repository commit information.Default: true. |
3 | –createApplication=true|false | When true (the default), creates a new initial app project in the src folder of the new workspace. When false, creates an empty workspace with no initial app. You can then use it to generate an application command so that all apps are created in the projects folder. Default: true. |
4 | -defaults=true|false | When true, disables interactive input prompts for options with a default. |
5 | –directory=directory | The directory name to create the workspace in. |
6 | –dryRun=true|false | When true, runs through and reports activity without writing out results.Default: false.Aliases: -d. |
7 | –force=true|false | When true, forces overwriting of existing files.Default: false.Aliases: -f. |
8 | –help=true|false|json|JSON | Shows a help message for this command in the console. Default: false. |
9 | –inlineStyle=true|false | When true, includes styles inline in the component TS file. By default, an external styles file is created and referenced in the component TS file. Default: false. |
10 | –inlineStyle=true|false | When true, includes styles inline in the componentTS file. By default, an external styles file is created and referenced in the component TS file. Default: false.Aliases: -t. |
11 | –interactive=true|false | When true, creates a project without any testing frameworks. (Use for learning purposes only.)Default: false. |
12 | –newProjectRoot=newProjectRoot | The path where new projects will be created, relative to the new workspace root.Default: projects. |
13 | –packageManager=npm|yarn|pnpm|cnpm | The package manager is used to install dependencies. |
14 | –prefix=prefix | The prefix to apply to generated selectors for the initial project. Default: app.Aliases: -p. |
15 | –prefix=prefix | The prefix to apply to generated selectors for the initial project. Default: app.Aliases: -p. |
16 | –routing=true|false | When true, generates a routing module for the initial project. |
17 | –skipGit=true|false | When true, does not initialize a git repository.Default: false.Aliases: -g. |
18 | –skipInstall=true|false | When true, does not install dependency packages.Default: false. |
19 | –skipTests=true|false | When true, does not generate “spec.ts” test files for the new project. Default: false.Aliases: -S. |
20 | –strict=true|false | Creates a workspace with stricter TypeScript compiler options.Default: false. |
21 | –style=css|scss|sass|less|styl | The file extension or preprocessor to use for style files. |
22 | –verbose=true|false | When true, adds more details to output logging. Default: false.Aliases: -v. |
23 | — viewEncapsulation=Emulated|Native|None|ShadowDom | The view encapsulation strategy to use in the initial project. |
Example
An example for ng new command is given below −
\>Node ng new Adglob ? Would you like to add Angular routing? Yes ? Which stylesheet format would you like to use? CSS CREATE Adglob/angular.json (3630 bytes) CREATE Adglob/package.json (1291 bytes) CREATE Adglob/README.md (1031 bytes) CREATE Adglob/tsconfig.json (489 bytes) CREATE Adglob/tslint.json (3125 bytes) CREATE Adglob/.editorconfig (274 bytes) CREATE Adglob/.gitignore (631 bytes) CREATE Adglob/browserslist (429 bytes) CREATE Adglob/karma.conf.js (1026 bytes) CREATE Adglob/tsconfig.app.json (210 bytes) CREATE Adglob/tsconfig.spec.json (270 bytes) CREATE Adglob/src/favicon.ico (948 bytes) CREATE Adglob/src/index.html (300 bytes) CREATE Adglob/src/main.ts (372 bytes) CREATE Adglob/src/polyfills.ts (2835 bytes) CREATE Adglob/src/styles.css (80 bytes) CREATE Adglob/src/test.ts (753 bytes) CREATE Adglob/src/assets/.gitkeep (0 bytes) CREATE Adglob/src/environments/environment.prod.ts (51 bytes) CREATE Adglob/src/environments/environment.ts (662 bytes) CREATE Adglob/src/app/app-routing.module.ts (246 bytes) CREATE Adglob/src/app/app.module.ts (393 bytes) CREATE Adglob/src/app/app.component.html (25755 bytes) CREATE Adglob/src/app/app.component.spec.ts (1083 bytes) CREATE Adglob/src/app/app.component.ts (218 bytes) CREATE Adglob/src/app/app.component.css (0 bytes) CREATE Adglob/e2e/protractor.conf.js (808 bytes) CREATE Adglob/e2e/tsconfig.json (214 bytes) CREATE Adglob/e2e/src/app.e2e-spec.ts (647 bytes) CREATE Adglob/e2e/src/app.po.ts (301 bytes) Packages installed successfully.
Here, ng new command has created an angular workspace and a project with the name Adglob in our Node directory.
Next Topic : Click Here
Pingback: Angular CLI - ng version Command | Adglob Infosystem Pvt Ltd
Pingback: Angular CLI - ng help Command - Adglob Infosystem Pvt Ltd
Pingback: Angular CLI - ng generate Command | Adglob Infosystem Pvt Ltd