$30 off During Our Annual Pro Sale. View Details »

Angular CLI

Angular CLI

Alejandra Bustos

July 16, 2016
Tweet

More Decks by Alejandra Bustos

Other Decks in Programming

Transcript

  1. Angular CLI A command line interface for Angular

  2. Configuración Angular 2 • Crear la estructura del proyecto •

    Instalar y configurar Typescript • Configurar System.js • Creación de componentes
  3. None
  4. None
  5. ¡Empecemos! npm install -g angular-cli ng new PROJECT_NAME

  6. // configuration files |- config/ |----- environment.dev.ts |----- environment.js |-----

    environment.prod.ts |----- karma-test-shim.js |----- karma.conf.js |----- protractor.conf.js // end-to-end-tests |- e2e/ |----- app.e2e.ts |----- app.po.ts |----- tsconfig.json |----- typings.d.ts // npm dependencies |- node_modules/ // public facing app. built things go here |- public/ // where most of the work will be done |- src/ |----- app/ |----- shared/ |----- index.ts |----- environment.ts |----- index.ts // our first generated component |----- project_name.component.css|html|spec.ts|ts |----- favicon.ico |----- icon.png |----- index.html |----- main.ts |----- manifest.webapp |----- system-config.ts |----- tsconfig.json |----- typings.d.ts // overall configuration |- typings/ |- .clang-format |- .editorconfig |- .gitignore |- angular-cli-build.js
  7. None
  8. ng new OPTIONS --dry-run --verbose --skip-npm --skip-git --directory

  9. ng generate Component ng g component my-new-component Directive ng g

    directive my-new-directive Pipe ng g pipe my-new-pipe Service ng g service my-new-service Class ng g class my-new-class Interface ng g interface my-new-interface Enum ng g enum my-new-enum
  10. ng serve http://localhost:4200/ ng serve --port 4201 --live-reload-port 49153

  11. Testing ng test

  12. GitHub Pages ng github-pages:deploy --message "Optional commit message"

  13. Integración con CSS • sass (node-sass) • less (less) •

    compass (compass-importer + node-sass) • stylus (stylus) npm install node-sass
  14. Importante https://cli.angular.io/ https://github.com/angular/angular-cli