Bummer! You have been redirected as the page you requested could not be found.

Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll

Using the Angular CLI

Well done!

You have completed Using the Angular CLI!

Sign up for Treehouse Back to Library

Creating and Serving an Application

7:17 with James Churchill

Let's create a new Angular app using the CLI and learn how to run it locally.

ng new Options

  • --dry-run Run through without making any changes. Will list all files that would have been created when running "ng new".
  • --verbose Adds more details to output logging.
  • --skip-install Skip installing packages.
  • --skip-commit Skip committing the first commit to git.
  • --collection Schematics collection to use.
  • --directory (string) The directory name to create the app in.
  • --inline-style (boolean) Specifies if the style will be in the ts file.
  • --inline-template (boolean) Specifies if the template will be in the ts file.
  • --view-encapsulation (string) Specifies the view encapsulation strategy.
  • --routing (boolean) Generates a routing module. Very useful if you know you're going to use routing in your app.
  • --prefix (string) (Default: app) The prefix to apply to generated selectors.
  • --style (string) (Default: css) The file extension to be used for style files.
  • --skip-tests (boolean) Skip creating spec files.
  • --skip-git (boolean) Skip initializing a git repository.
  • --minimal (boolean) Create a minimal app (no test structure, inline styles/templates).
  • --service-worker (boolean) Installs the @angular/service-worker.

ng serve Options

  • --target (String) (Default: development) Defines the build target.
  • --environment (String) Defines the build environment.
  • --output-path (Path) Path where output will be placed.
  • --aot (Boolean) Build using Ahead of Time compilation.
  • --sourcemaps (Boolean) Output sourcemaps.
  • --vendor-chunk (Boolean) Use a separate bundle containing only vendor libraries.
  • --common-chunk (Boolean) (Default: true) Use a separate bundle containing code used across multiple bundles.
  • --base-href (String) Base url for the application being built.
  • --deploy-url (String) URL where files will be deployed.
  • --verbose (Boolean) (Default: false) Adds more details to output logging.
  • --progress (Boolean) (Default: true) Log progress to the console while building.
  • --i18n-file (String) Localization file to use for i18n.
  • --i18n-format (String) Format of the localization file specified with --i18n-file.
  • --locale (String) Locale to use for i18n.
  • --missing-translation (String) How to handle missing translations for i18n.
  • --extract-css (Boolean) Extract css from global styles onto css files instead of js ones.
  • --watch (Boolean) (Default: true) Rebuild on change.
  • --output-hashing=none|all|media|bundles (String) Define the output filename cache-busting hashing mode.
  • --poll (Number) Enable and define the file watching poll time period (milliseconds).
  • --app (String) Specifies app name or index to use.
  • --delete-output-path (Boolean) (Default: true) Delete output path before build.
  • --preserve-symlinks (Boolean) (Default: false) Do not use the real path when resolving modules.
  • --extract-licenses (Boolean) (Default: true) Extract all licenses in a separate file, in the case of production builds only.
  • --show-circular-dependencies (Boolean) (Default: true) Show circular dependency warnings on builds.
  • --build-optimizer (Boolean) Enables @angular-devkit/build-optimizer optimizations when using --aot.
  • --named-chunks (Boolean) Use file name for lazy loaded chunks.
  • --subresource-integrity (Boolean) (Default: false) Enables the use of subresource integrity validation.
  • --bundle-dependencies (none, all) (Default: none) Available on server platform only. Which external dependencies to bundle into the module. By default, all of node_modules will be kept as requires.
  • --service-worker (Boolean) (Default: true) Generates a service worker config for production builds, if the app has service worker enabled.
  • --skip-app-shell (Boolean) (Default: false) Flag to prevent building an app shell
  • --port (Number) (Default: 4200) Port to listen to for serving.
  • --host (String) (Default: localhost) Listens only on localhost by default.
  • --proxy-config (Path) Proxy configuration file.
  • --ssl (Boolean) (Default: false) Serve using HTTPS.
  • --ssl-key (String) (Default: ssl/server.key) SSL key to use for serving HTTPS.
  • --ssl-cert (String) (Default: ssl/server.crt) SSL certificate to use for serving HTTPS.
  • --open (Boolean) (Default: false) Opens the url in default browser.
  • --live-reload (Boolean) (Default: true) Whether to reload the page on change, using live-reload.
  • --public-host (String) Specify the URL that the browser client will use.
  • --disable-host-check (Boolean) (Default: false) Don't verify connected clients are part of allowed hosts.
  • --serve-path (String) The pathname where the app will be served.
  • --hmr (Boolean) (Default: false) Enable hot module replacement.

Additional Learning

Related Discussions

Have questions about this video? Start a discussion with the community and Treehouse staff.

Sign up

    Related Discussions

    Have questions about this video? Start a discussion with the community and Treehouse staff.

    Sign up

    I'm gonna browse to my Desktop directory, but 0:00
    you can use whatever directory you'd like. 0:00
    To generate a new app, we'll use the ng new command, followed by the name for 0:04
    our application. 0:09
    How about my dash first dash app. 0:10
    And press enter to execute the command. 0:16
    The CLI creates a new directory named my first app. 0:19
    Within that directory, it generates our app's source files and 0:22
    directories based upon our app name and the official angular style guide. 0:26

    You need to sign up for Treehouse in order to download course files.

    Sign up

      You need to sign up for Treehouse in order to set up Workspace

      Sign up