记录一些学习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-template
As 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 deprecated
shortly 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.json
Successfully 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 issue
npm WARN deprecated minimatch@0.3.0: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue
npm WARN prefer global node-gyp@3.5.0 should be installed with -g
Cannot download "https://github.com/sass/node-sass/releases/download/v4.5.0/win32-x64-51_binding.node":

ESOCKETTIMEDOUT

Hint: If github.com is not accessible in your location
try setting a proxy via HTTP_PROXY, e.g.

export HTTP_PROXY=http://example.com:1234

or configure npm proxy via

npm config set proxy http://example.com:8080 gyp info it worked if it ends with ok
gyp 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.0
gyp info using node@7.5.0 | win32 | x64
gyp verb command rebuild []
gyp verb command clean []
gyp verb clean removing "build" directory
gyp verb command configure []
gyp verb check python checking for Python executable "python2" in the PATH
gyp verb `which` failed Error: not found: python2
gyp 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:16
gyp verb `which` failed     at H:\Angular\angular-template\node_modules\isexe\index.js:44:5
gyp verb `which` failed     at H:\Angular\angular-template\node_modules\isexe\windows.js:29:5
gyp verb `which` failed     at FSReqWrap.oncomplete (fs.js:112:15)
gyp verb `which` failed  python2 { Error: not found: python2
gyp 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:16
gyp verb `which` failed     at H:\Angular\angular-template\node_modules\isexe\index.js:44:5
gyp verb `which` failed     at H:\Angular\angular-template\node_modules\isexe\windows.js:29:5
gyp verb `which` failed     at FSReqWrap.oncomplete (fs.js:112:15) code: 'ENOENT' }
gyp verb check python checking for Python executable "python" in the PATH
gyp verb `which` succeeded python D:\Python\Python27\python.EXE
gyp 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.0
gyp verb command install [ '7.5.0' ]
gyp verb install input version string "7.5.0"
gyp verb install installing version: 7.5.0
gyp verb install --ensure was passed, so won't reinstall if already installed
gyp verb install version is already installed, need to check "installVersion"
gyp verb got "installVersion" 9
gyp verb needs "installVersion" 9
gyp verb install version is good
gyp verb get node dir target node version installed: 7.5.0
gyp verb build dir attempting to create "build" dir: H:\Angular\angular-template\node_modules\node-sass\build
gyp verb build dir "build" dir needed to be created? H:\Angular\a
c2f1
ngular-template\node_modules\node-sass\build
gyp verb build/config.gypi creating config file
gyp verb build/config.gypi writing out config file: H:\Angular\angular-template\node_modules\node-sass\build\config.gypi
gyp verb config.gypi checking for gypi file: H:\Angular\angular-template\node_modules\node-sass\config.gypi
gyp verb common.gypi checking for gypi file: H:\Angular\angular-template\node_modules\node-sass\common.gypi
gyp verb gyp gyp format was not specified; forcing "msvs"
gyp info spawn D:\Python\Python27\python.EXE
gyp 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 Release
gyp verb architecture x64
gyp verb node dev dir C:\Users\Administrator\.node-gyp\7.5.0
gyp verb found first Solution file build/binding.sln
gyp verb could not find "msbuild.exe" in PATH - finding location in registry
gyp verb "Release" dir needed to be created? null
gyp verb copying "node.lib" for x64 C:\Users\Administrator\.node-gyp\7.5.0\Release\node.lib
gyp info spawn C:\Windows\Microsoft.NET\Framework\v4.0.30319\msbuild.exe
gyp info spawn args [ 'build/binding.sln',
gyp info spawn args   '/nologo',
gyp info spawn args   '/p:Configuration=Release;Platform=x64' ]
gyp ERR! build error
gyp ERR! stack Error: `C:\Windows\Microsoft.NET\Framework\v4.0.30319\msbuild.exe` failed with exit code: 1
gyp 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.7601
gyp 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-sass
gyp ERR! node -v v7.5.0
gyp ERR! node-gyp -v v3.5.0
gyp ERR! not ok
Build failed with error code: 1
npm 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.7601
npm ERR! argv "D:\\nodejs\\node.exe" "D:\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "install"
npm ERR! node v7.5.0
npm ERR! npm  v4.1.2
npm ERR! code ELIFECYCLE

npm ERR! node-sass@4.5.0 postinstall: `node scripts/build.js`
npm ERR! Exit status 1
npm 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.js
npm ERR! You can get information on how to open an issue for this project with:
npm ERR!     npm bugs node-sass
npm ERR! Or if that isn't available, you can get their info via:
npm ERR!     npm owner ls node-sass
npm 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.log

Package 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-template
As 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 deprecated
shortly 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.json
Successfully initialized git.
Installing packages for tooling via npm.
Installed packages for tooling via npm.
Project 'angular-template' successfully created.