记录一些学习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 [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue npm WARN deprecated [email protected]: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue npm WARN prefer global [email protected] 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 [email protected] gyp info using [email protected] | 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\angular-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: [email protected]^1.0.0 (node_modules\chokidar\node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: 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! [email protected] postinstall: `node scripts/build.js` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the [email protected] 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.