记录一些学习angular2中遇到的问题

之前跟着angular2中文官网的教程做完了angular-tour-of-heroes这个demo,感觉没学到的东西不多,或者说忘掉很多了.所以想着到angular2英文官网继续学习.

问题一

我跟着CLI QUICKSTART快速建一个angular2的程序, 在全局安装完Angular-CLI后,我测试创建一个新的项目,执行下面的命令:

ng new my-app

报了一大堆错误,第一个错误信息我没有记录下来了.记录下解决方法,就是安装python(我的是python2.7, 开始装最新的python3.6.0解决不了问题),并且把python加到环境变量.

然后ng new my-app, 报了下面的错误:

$ ng new angular-templateAs a forewarning, we are moving the CLI npm package to "@angular/cli" with the next release,which will only support Node 6.9 and greater. This package will be officially deprecatedshortly after.To disable this warning use "ng set --global warnings.packageDeprecation=false".installing ng2  create .editorconfig  create README.md  create src\app\app.component.css  create src\app\app.component.html  create src\app\app.component.spec.ts  create src\app\app.component.ts  create src\app\app.module.ts  create src\assets\.gitkeep  create src\environments\environment.prod.ts  create src\environments\environment.ts  create src\favicon.ico  create src\index.html  create src\main.ts  create src\polyfills.ts  create src\styles.css  create src\test.ts  create src\tsconfig.json  create angular-cli.json  create e2e\app.e2e-spec.ts  create e2e\app.po.ts  create e2e\tsconfig.json  create .gitignore  create karma.conf.js  create package.json  create protractor.conf.js  create tslint.jsonSuccessfully initialized git.Installing packages for tooling via npm.npm WARN deprecated minimatch@2.0.10: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issuenpm WARN deprecated minimatch@0.3.0: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issuenpm WARN prefer global node-gyp@3.5.0 should be installed with -gCannot download "https://github.com/sass/node-sass/releases/download/v4.5.0/win32-x64-51_binding.node":ESOCKETTIMEDOUTHint: If github.com is not accessible in your location      try setting a proxy via HTTP_PROXY, e.g.      export HTTP_PROXY=http://example.com:1234or configure npm proxy via      npm config set proxy http://example.com:8080gyp info it worked if it ends with okgyp verb cli [ 'D:\\nodejs\\node.exe',gyp verb cli   'H:\\Angular\\angular-template\\node_modules\\node-gyp\\bin\\node-gyp.js',gyp verb cli   'rebuild',gyp verb cli   '--verbose',gyp verb cli   '--libsass_ext=',gyp verb cli   '--libsass_cflags=',gyp verb cli   '--libsass_ldflags=',gyp verb cli   '--libsass_library=' ]gyp info using node-gyp@3.5.0gyp info using node@7.5.0 | win32 | x64gyp verb command rebuild []gyp verb command clean []gyp verb clean removing "build" directorygyp verb command configure []gyp verb check python checking for Python executable "python2" in the PATHgyp verb `which` failed Error: not found: python2gyp verb `which` failed     at getNotFoundError (H:\Angular\angular-template\node_modules\which\which.js:13:12)gyp verb `which` failed     at F (H:\Angular\angular-template\node_modules\which\which.js:68:19)gyp verb `which` failed     at E (H:\Angular\angular-template\node_modules\which\which.js:80:29)gyp verb `which` failed     at H:\Angular\angular-template\node_modules\which\which.js:89:16gyp verb `which` failed     at H:\Angular\angular-template\node_modules\isexe\index.js:44:5gyp verb `which` failed     at H:\Angular\angular-template\node_modules\isexe\windows.js:29:5gyp verb `which` failed     at FSReqWrap.oncomplete (fs.js:112:15)gyp verb `which` failed  python2 { Error: not found: python2gyp verb `which` failed     at getNotFoundError (H:\Angular\angular-template\node_modules\which\which.js:13:12)gyp verb `which` failed     at F (H:\Angular\angular-template\node_modules\which\which.js:68:19)gyp verb `which` failed     at E (H:\Angular\angular-template\node_modules\which\which.js:80:29)gyp verb `which` failed     at H:\Angular\angular-template\node_modules\which\which.js:89:16gyp verb `which` failed     at H:\Angular\angular-template\node_modules\isexe\index.js:44:5gyp verb `which` failed     at H:\Angular\angular-template\node_modules\isexe\windows.js:29:5gyp verb `which` failed     at FSReqWrap.oncomplete (fs.js:112:15) code: 'ENOENT' }gyp verb check python checking for Python executable "python" in the PATHgyp verb `which` succeeded python D:\Python\Python27\python.EXEgyp verb check python version `D:\Python\Python27\python.EXE -c "import platform; print(platform.python_version());"` returned: "2.7.6\r\n"gyp verb get node dir no --target version specified, falling back to host node version: 7.5.0gyp verb command install [ '7.5.0' ]gyp verb install input version string "7.5.0"gyp verb install installing version: 7.5.0gyp verb install --ensure was passed, so won't reinstall if already installedgyp verb install version is already installed, need to check "installVersion"gyp verb got "installVersion" 9gyp verb needs "installVersion" 9gyp verb install version is goodgyp verb get node dir target node version installed: 7.5.0gyp verb build dir attempting to create "build" dir: H:\Angular\angular-template\node_modules\node-sass\buildgyp verb build dir "build" dir needed to be created? H:\Angular\angular-template\node_modules\node-sass\buildgyp verb build/config.gypi creating config filegyp verb build/config.gypi writing out config file: H:\Angular\angular-template\node_modules\node-sass\build\config.gypigyp verb config.gypi checking for gypi file: H:\Angular\angular-template\node_modules\node-sass\config.gypigyp verb common.gypi checking for gypi file: H:\Angular\angular-template\node_modules\node-sass\common.gypigyp verb gyp gyp format was not specified; forcing "msvs"gyp info spawn D:\Python\Python27\python.EXEgyp info spawn args [ 'H:\\Angular\\angular-template\\node_modules\\node-gyp\\gyp\\gyp_main.py',gyp info spawn args   'binding.gyp',gyp info spawn args   '-f',gyp info spawn args   'msvs',gyp info spawn args   '-G',gyp info spawn args   'msvs_version=auto',gyp info spawn args   '-I',gyp info spawn args   'H:\\Angular\\angular-template\\node_modules\\node-sass\\build\\config.gypi',gyp info spawn args   '-I',gyp info spawn args   'H:\\Angular\\angular-template\\node_modules\\node-gyp\\addon.gypi',gyp info spawn args   '-I',gyp info spawn args   'C:\\Users\\Administrator\\.node-gyp\\7.5.0\\include\\node\\common.gypi',gyp info spawn args   '-Dlibrary=shared_library',gyp info spawn args   '-Dvisibility=default',gyp info spawn args   '-Dnode_root_dir=C:\\Users\\Administrator\\.node-gyp\\7.5.0',gyp info spawn args   '-Dnode_gyp_dir=H:\\Angular\\angular-template\\node_modules\\node-gyp',gyp info spawn args   '-Dnode_lib_file=node.lib',gyp info spawn args   '-Dmodule_root_dir=H:\\Angular\\angular-template\\node_modules\\node-sass',gyp info spawn args   '--depth=.',gyp info spawn args   '--no-parallel',gyp info spawn args   '--generator-output',gyp info spawn args   'H:\\Angular\\angular-template\\node_modules\\node-sass\\build',gyp info spawn args   '-Goutput_dir=.' ]gyp verb command build []gyp verb build type Releasegyp verb architecture x64gyp verb node dev dir C:\Users\Administrator\.node-gyp\7.5.0gyp verb found first Solution file build/binding.slngyp verb could not find "msbuild.exe" in PATH - finding location in registrygyp verb "Release" dir needed to be created? nullgyp verb copying "node.lib" for x64 C:\Users\Administrator\.node-gyp\7.5.0\Release\node.libgyp info spawn C:\Windows\Microsoft.NET\Framework\v4.0.30319\msbuild.exegyp info spawn args [ 'build/binding.sln',gyp info spawn args   '/nologo',gyp info spawn args   '/p:Configuration=Release;Platform=x64' ]gyp ERR! build errorgyp ERR! stack Error: `C:\Windows\Microsoft.NET\Framework\v4.0.30319\msbuild.exe` failed with exit code: 1gyp ERR! stack     at ChildProcess.onExit (H:\Angular\angular-template\node_modules\node-gyp\lib\build.js:276:23)gyp ERR! stack     at emitTwo (events.js:106:13)gyp ERR! stack     at ChildProcess.emit (events.js:192:7)gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:215:12)gyp ERR! System Windows_NT 6.1.7601gyp ERR! command "D:\\nodejs\\node.exe" "H:\\Angular\\angular-template\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="gyp ERR! cwd H:\Angular\angular-template\node_modules\node-sassgyp ERR! node -v v7.5.0gyp ERR! node-gyp -v v3.5.0gyp ERR! not okBuild failed with error code: 1npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\chokidar\node_modules\fsevents):npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.0.17: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})npm ERR! Windows_NT 6.1.7601npm ERR! argv "D:\\nodejs\\node.exe" "D:\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "install"npm ERR! node v7.5.0npm ERR! npm  v4.1.2npm ERR! code ELIFECYCLEnpm ERR! node-sass@4.5.0 postinstall: `node scripts/build.js`npm ERR! Exit status 1npm ERR!npm ERR! Failed at the node-sass@4.5.0 postinstall script 'node scripts/build.js'.npm ERR! Make sure you have the latest version of node.js and npm installed.npm ERR! If you do, this is most likely a problem with the node-sass package,npm ERR! not with npm itself.npm ERR! Tell the author that this fails on your system:npm ERR!     node scripts/build.jsnpm ERR! You can get information on how to open an issue for this project with:npm ERR!     npm bugs node-sassnpm ERR! Or if that isn't available, you can get their info via:npm ERR!     npm owner ls node-sassnpm ERR! There is likely additional logging output above.npm ERR! Please include the following file with any support request:npm ERR!     H:\Angular\angular-template\npm-debug.logPackage install failed, see above.

这一大堆东西我也不知道是啥,google gyp ERR! stack Error: ` failed with exit code: 1后, 在这里找到了解决方法,我根据里面的方法.
首先, 我执行命令$ npm install -g node-gyp, 更新了node-gym, 并没有效果.
然后, 我安装了Windows SDK 7.1, 还是没有效果.
最后, 安装了Visual Studio 2013(这个东西有点大, 6.5G), 问题就得到了解决…
下面正确是姿势:

$ ng new angular-templateAs a forewarning, we are moving the CLI npm package to "@angular/cli" with the next release,which will only support Node 6.9 and greater. This package will be officially deprecatedshortly after.To disable this warning use "ng set --global warnings.packageDeprecation=false".installing ng2  create .editorconfig  create README.md  create src\app\app.component.css  create src\app\app.component.html  create src\app\app.component.spec.ts  create src\app\app.component.ts  create src\app\app.module.ts  create src\assets\.gitkeep  create src\environments\environment.prod.ts  create src\environments\environment.ts  create src\favicon.ico  create src\index.html  create src\main.ts  create src\polyfills.ts  create src\styles.css  create src\test.ts  create src\tsconfig.json  create angular-cli.json  create e2e\app.e2e-spec.ts  create e2e\app.po.ts  create e2e\tsconfig.json  create .gitignore  create karma.conf.js  create package.json  create protractor.conf.js  create tslint.jsonSuccessfully initialized git.Installing packages for tooling via npm.Installed packages for tooling via npm.Project 'angular-template' successfully created.