Angular CLI: 1.6.7 入门

当你使用npm或者yarn也安装不了angular-cli时，请使用淘宝镜像。

 

Step1

npm i -g cnpm --registry=https://registry.npm.taobao.org

 

Step2

cnpm i -g @angular/cli

 

C:\Users\Administrator\Desktop>cnpm i -g @angular/cli
Downloading @angular/cli to I:\Node\node-v8.9.4-win-x64\node_modules\@angular\cli_tmp
Copying I:\Node\node-v8.9.4-win-x64\node_modules\@angular\cli_tmp\_@angular_cli@1.6.7@@angular\cli to I:\Node\node-v8.9.4-win-x64\node_modules\@angular\cli
Installing @angular/cli's dependencies to I:\Node\node-v8.9.4-win-x64\node_modules\@angular\cli/node_modules
[1/57] circular-dependency-plugin@^4.2.1 installed at node_modules\_circular-dependency-plugin@4.4.0@circular-dependency-plugin
[2/57] @ngtools/json-schema@1.1.0 installed at node_modules\_@ngtools_json-schema@1.1.0@@ngtools\json-schema
[3/57] core-object@^3.1.0 installed at node_modules\_core-object@3.1.5@core-object
[4/57] chalk@~2.2.0 installed at node_modules\_chalk@2.2.2@chalk
[5/57] css-loader@^0.28.1 installed at node_modules\_css-loader@0.28.9@css-loader
[6/57] denodeify@^1.2.1 installed at node_modules\_denodeify@1.2.1@denodeify
[7/57] ember-cli-string-utils@^1.0.0 installed at node_modules\_ember-cli-string-utils@1.1.0@ember-cli-string-utils
[8/57] exports-loader@^0.6.3 installed at node_modules\_exports-loader@0.6.4@exports-loader
[9/57] autoprefixer@^7.2.3 installed at node_modules\_autoprefixer@7.2.5@autoprefixer
[10/57] copy-webpack-plugin@^4.1.1 installed at node_modules\_copy-webpack-plugin@4.3.1@copy-webpack-plugin
[11/57] file-loader@^1.1.5 installed at node_modules\_file-loader@1.1.6@file-loader
[12/57] glob@^7.0.3 existed at node_modules\_glob@7.1.2@glob
[13/57] extract-text-webpack-plugin@^3.0.2 installed at node_modules\_extract-text-webpack-plugin@3.0.2@extract-text-webpack-plugin
[14/57] karma-source-map-support@^1.2.0 installed at node_modules\_karma-source-map-support@1.2.0@karma-source-map-support
[15/57] fs-extra@^4.0.0 installed at node_modules\_fs-extra@4.0.3@fs-extra
[16/57] html-webpack-plugin@^2.29.0 installed at node_modules\_html-webpack-plugin@2.30.1@html-webpack-plugin
[17/57] license-webpack-plugin@^1.0.0 installed at node_modules\_license-webpack-plugin@1.1.1@license-webpack-plugin
[18/57] lodash@^4.11.1 existed at node_modules\_lodash@4.17.4@lodash
[19/57] loader-utils@1.1.0 existed at node_modules\_loader-utils@1.1.0@loader-utils
[20/57] memory-fs@^0.4.1 existed at node_modules\_memory-fs@0.4.1@memory-fs
[21/57] minimatch@^3.0.4 existed at node_modules\_minimatch@3.0.4@minimatch
[22/57] node-modules-path@^1.0.0 installed at node_modules\_node-modules-path@1.0.1@node-modules-path
[23/57] common-tags@^1.3.1 installed at node_modules\_common-tags@1.7.2@common-tags
[24/57] nopt@^4.0.1 installed at node_modules\_nopt@4.0.1@nopt
[25/57] @ngtools/webpack@1.9.7 installed at node_modules\_@ngtools_webpack@1.9.7@@ngtools\webpack
[26/57] cssnano@^3.10.0 installed at node_modules\_cssnano@3.10.0@cssnano
[27/57] opn@~5.1.0 installed at node_modules\_opn@5.1.0@opn
[28/57] portfinder@~1.0.12 installed at node_modules\_portfinder@1.0.13@portfinder
[29/57] raw-loader@^0.5.1 installed at node_modules\_raw-loader@0.5.1@raw-loader
[30/57] resolve@^1.1.7 existed at node_modules\_resolve@1.5.0@resolve
[31/57] postcss-import@^11.0.0 installed at node_modules\_postcss-import@11.0.0@postcss-import
[32/57] postcss-url@^7.1.2 installed at node_modules\_postcss-url@7.3.0@postcss-url
[33/57] semver@^5.1.0 existed at node_modules\_semver@5.5.0@semver
[34/57] less-loader@^4.0.5 installed at node_modules\_less-loader@4.0.5@less-loader
[35/57] source-map-support@^0.4.1 existed at node_modules\_source-map-support@0.4.18@source-map-support
[36/57] silent-error@^1.0.0 installed at node_modules\_silent-error@1.1.0@silent-error
[37/57] style-loader@^0.13.1 installed at node_modules\_style-loader@0.13.2@style-loader
[38/57] postcss-loader@^2.0.10 installed at node_modules\_postcss-loader@2.1.0@postcss-loader
[39/57] stylus-loader@^3.0.1 installed at node_modules\_stylus-loader@3.0.1@stylus-loader
[40/57] istanbul-instrumenter-loader@^3.0.0 installed at node_modules\_istanbul-instrumenter-loader@3.0.0@istanbul-instrumenter-loader
[41/57] url-loader@^0.6.2 installed at node_modules\_url-loader@0.6.2@url-loader
[42/57] webpack@~3.10.0 existed at node_modules\_webpack@3.10.0@webpack
fsevents@1.1.3 download from binary mirror: {"module_name":"fse","module_path":"./lib/binding/{configuration}/{node_abi}-{platform}-{arch}/","remote_path":"./v{version}/","package_name":"{module_name}-v{version}-{node_abi}-{platform}-{arch}.tar.gz","host":"https://npm.taobao.org/mirrors/fsevents"}
platform unsupported @angular-devkit/core@0.0.29 › chokidar@1.7.0 › fsevents@^1.0.0 Package require os(darwin) not compatible with your platform(win32)
[fsevents@^1.0.0] optional install error: Package require os(darwin) not compatible with your platform(win32)
[43/57] stylus@^0.54.5 installed at node_modules\_stylus@0.54.5@stylus
[44/57] webpack-dev-middleware@~1.12.0 installed at node_modules\_webpack-dev-middleware@1.12.2@webpack-dev-middleware
[45/57] uglifyjs-webpack-plugin@^1.1.5 installed at node_modules\_uglifyjs-webpack-plugin@1.1.8@uglifyjs-webpack-plugin
[46/57] webpack-sources@^1.0.0 existed at node_modules\_webpack-sources@1.1.0@webpack-sources
[47/57] webpack-merge@^4.1.0 installed at node_modules\_webpack-merge@4.1.1@webpack-merge
[48/57] less@^2.7.2 installed at node_modules\_less@2.7.3@less
[49/57] webpack-subresource-integrity@^1.0.1 installed at node_modules\_webpack-subresource-integrity@1.0.3@webpack-subresource-integrity
[50/57] node-sass@^4.7.2 existed at node_modules\_node-sass@4.7.2@node-sass
[51/57] @schematics/angular@0.1.17 installed at node_modules\_@schematics_angular@0.1.17@@schematics\angular
[52/57] @angular-devkit/build-optimizer@0.0.42 installed at node_modules\_@angular-devkit_build-optimizer@0.0.42@@angular-devkit\build-optimizer
[53/57] webpack-dev-server@~2.11.0 installed at node_modules\_webpack-dev-server@2.11.1@webpack-dev-server
[54/57] rxjs@^5.5.6 existed at node_modules\_rxjs@5.5.6@rxjs
[55/57] @angular-devkit/schematics@0.0.52 installed at node_modules\_@angular-devkit_schematics@0.0.52@@angular-devkit\schematics
[56/57] sass-loader@^6.0.6 installed at node_modules\_sass-loader@6.0.6@sass-loader
[57/57] @angular-devkit/core@0.0.29 installed at node_modules\_@angular-devkit_core@0.0.29@@angular-devkit\core
execute post install 2 scripts...
[1/2] scripts.postinstall @ngtools/webpack@1.9.7 › webpack@3.10.0 › uglifyjs-webpack-plugin@^0.4.6 run "node lib/post_install.js"
[1/2] scripts.postinstall @ngtools/webpack@1.9.7 › webpack@3.10.0 › uglifyjs-webpack-plugin@^0.4.6 finished in 360ms
[2/2] scripts.install sass-loader@6.0.6 › node-sass@^4.7.2 run "node scripts/install.js"
Downloading binary from https://npm.taobao.org/mirrors/node-sass/v4.7.2/win32-x64-57_binding.node
Download complete
Binary saved to I:\Node\node-v8.9.4-win-x64\node_modules\@angular\cli\node_modules\_node-sass@4.7.2@node-sass\vendor\win32-x64-57\binding.node
Caching binary to C:\Users\Administrator\.npminstall_tarball\node-sass\4.7.2\win32-x64-57_binding.node
[2/2] scripts.install sass-loader@6.0.6 › node-sass@^4.7.2 finished in 1s
[2/2] scripts.postinstall sass-loader@6.0.6 › node-sass@^4.7.2 run "node scripts/build.js"
Binary found at I:\Node\node-v8.9.4-win-x64\node_modules\@angular\cli\node_modules\_node-sass@4.7.2@node-sass\vendor\win32-x64-57\binding.node
Testing binary
Binary is fine
[2/2] scripts.postinstall sass-loader@6.0.6 › node-sass@^4.7.2 finished in 2s
Recently updated (since 2018-01-26): 13 packages (detail see file I:\Node\node-v8.9.4-win-x64\node_modules\@angular\cli\node_modules\.recently_updates.txt)
  Today:
    → autoprefixer@7.2.5 › postcss@^6.0.16(6.0.17) (03:56:55)
    → @ngtools/webpack@1.9.7 › webpack@3.10.0 › acorn@^5.0.0(5.4.1) (17:19:21)
    → @ngtools/webpack@1.9.7 › webpack@3.10.0 › yargs@8.0.2 › os-locale@2.1.0 › mem@1.1.0 › mimic-fn@^1.0.0(1.2.0) (11:28:18)
    → postcss-loader@^2.0.10(2.1.0) (10:49:53)
  2018-02-01
    → @ngtools/webpack@1.9.7(1.9.7) (05:22:12)
    → autoprefixer@7.2.5 › browserslist@2.11.3 › electron-to-chromium@^1.3.30(1.3.32) (09:02:19)
  2018-01-31
    → cssnano@3.10.0 › autoprefixer@6.7.7 › caniuse-db@^1.0.30000634(1.0.30000800) (12:37:33)
  2018-01-30
    → uglifyjs-webpack-plugin@^1.1.5(1.1.8) (04:45:55)
  2018-01-29
    → webpack-dev-server@2.11.1 › selfsigned@^1.9.1(1.10.2) (20:49:12)
  2018-01-28
    → uglifyjs-webpack-plugin@1.1.8 › uglify-es@^3.3.4(3.3.9) (00:54:24)
  2018-01-27
    → css-loader@0.28.9 › postcss@5.2.18 › js-base64@^2.1.9(2.4.3) (15:43:43)
    → html-webpack-plugin@2.30.1 › html-minifier@3.5.8 › uglify-js@3.3.x(3.3.9) (22:58:27)
    → webpack-dev-server@2.11.1 › bonjour@3.5.0 › multicast-dns@^6.0.1(6.2.3) (18:17:19)
All packages installed (893 packages installed from npm registry, used 1m, speed 336.62kB/s, json 760(1.41MB), tarball 23.83MB)
[@angular/cli@1.6.7] link I:\Node\node-v8.9.4-win-x64\ng@ -> I:\Node\node-v8.9.4-win-x64\node_modules\@angular\cli\bin\ng

 

step3

ng new test-app

step4

cd test-app
ng serve --open

 

最后，只要学习一下相对应的ng-cli参数即可。