Angular CLI – ng new Command

Angular CLI - ng new Command

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 & SyntaxDescription
1<name>The name of the new workspace and initial project.

Options

Options are optional parameters.

Sr.No.Option & SyntaxDescription
1–collection=collectionA collection of schematics to use in generating the initial app.Aliases: -c.
2–commit=true|falseInitial git repository commit information.Default: true.
3–createApplication=true|falseWhen 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|falseWhen true, disables interactive input prompts for options with a default.
5–directory=directoryThe directory name to create the workspace in.
6–dryRun=true|falseWhen true, runs through and reports activity without writing out results.Default: false.Aliases: -d.
7–force=true|falseWhen true, forces overwriting of existing files.Default: false.Aliases: -f.
8–help=true|false|json|JSONShows a help message for this command in the console. Default: false.
9–inlineStyle=true|falseWhen 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|falseWhen 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|falseWhen true, creates a project without any testing frameworks. (Use for learning purposes only.)Default: false.
12–newProjectRoot=newProjectRootThe path where new projects will be created, relative to the new workspace root.Default: projects.
13–packageManager=npm|yarn|pnpm|cnpmThe package manager is used to install dependencies.
14–prefix=prefixThe prefix to apply to generated selectors for the initial project. Default: app.Aliases: -p.
15–prefix=prefixThe prefix to apply to generated selectors for the initial project. Default: app.Aliases: -p.
16–routing=true|falseWhen true, generates a routing module for the initial project.
17–skipGit=true|falseWhen true, does not initialize a git repository.Default: false.Aliases: -g.
18–skipInstall=true|falseWhen true, does not install dependency packages.Default: false.
19–skipTests=true|falseWhen true, does not generate “spec.ts” test files for the new project. Default: false.Aliases: -S.
20–strict=true|falseCreates a workspace with stricter TypeScript compiler options.Default: false.
21–style=css|scss|sass|less|stylThe file extension or preprocessor to use for style files.
22–verbose=true|falseWhen true, adds more details to output logging. Default: false.Aliases: -v.
23— viewEncapsulation=Emulated|Native|None|ShadowDomThe 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

This Post Has 3 Comments

Leave a Reply