富贵资源网 Design By www.hznty.com
Angular4我自己还在摸索学习中，这个系列中的笔记会不定期修改和更新……
一、安装nodejs（下面方式 二选一，个人推荐第二种）
1、nodejs官网下载安装
2、使用nvm安装管理（具体方式参照我的另一篇）
二、全局安装angular-cli
npm install -g @angular/cli
三、进入一个存放项目的文件夹，运行以下代码，初始化项目
ng new <项目名>
四、启动项目
cd <项目名> npm install ng serve
附：
1.引入jQuery和bootstrap
a.安装jquery和bootstrap
npm install jquery --save npm install bootstrap --save
b.安装@types/jquery
复制代码 代码如下:
npm install @types/jquery --save-dev <!-- 这一步是让jquery可以在Ts文件中被识别使用 --!>
c.在项目的根目录下找到.angular-cli.json文件修改其配置，修改时注意引用路径是以index.html文件为起始路径，而不是项目根路径
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"project": {
"version": "1.0.0-alpha.4",
"name": "angualr4demo"
},
"apps": [
{
"root": "src",
"outDir": "dist",
"assets": ["assets"],
"index": "index.html",
"main": "main.ts",
"polyfills": "polyfills.ts",
"test": "test.ts",
"tsconfig": "tsconfig.app.json",
"testTsconfig": "tsconfig.spec.json",
"prefix": "app",
"styles": [
"../node_modules/bootstrap/dist/css/bootstrap.min.css",<!-- 这里添加bootstrap引用路径 --!>
"scss/style.scss"
],
"scripts": [
"../node_modules/jquery/dist/jquery.js"<!-- 这里添加jquery引用路径 --!>
],
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
}
],
"e2e": {
"protractor": {
"config": "./protractor.conf.js"
}
},
"lint": [
{
"project": "src/tsconfig.app.json"
},
{
"project": "src/tsconfig.spec.json"
},
{
"project": "e2e/tsconfig.e2e.json"
}
],
"test": {
"karma": {
"config": "./karma.conf.js"
}
},
"defaults": {
"styleExt": "scss",
"prefixInterfaces": false
}
}
d. 在src/typings.d.ts 中添加
declare var $: JQueryStatic;
2、引入require
在在src/typings.d.ts 中添加
declare var require: any;
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。
富贵资源网 Design By www.hznty.com
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
富贵资源网 Design By www.hznty.com
暂无评论...