Angular4学习笔记之新建项目的方法
Angular4我自己还在摸索学习中,这个系列中的笔记会不定期修改和更新……
一、安装nodejs(下面方式二选一,个人推荐第二种)
1、nodejs官网下载安装
2、使用nvm安装管理(具体方式参照我的另一篇)
二、全局安装angular-cli
npminstall-g@angular/cli
三、进入一个存放项目的文件夹,运行以下代码,初始化项目
ngnew<项目名>
四、启动项目
cd<项目名> npminstall ngserve
附:
1.引入jQuery和bootstrap
a.安装jquery和bootstrap
npminstalljquery--save npminstallbootstrap--save
b.安装@types/jquery
npminstall@types/jquery--save-dev
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",
"scss/style.scss"
],
"scripts":[
"../node_modules/jquery/dist/jquery.js"
],
"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中添加
declarevar$:JQueryStatic;
2、引入require
在在src/typings.d.ts中添加
declarevarrequire:any;
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持毛票票。