參考資料: http://www.cnblogs.com/this-xiaoming/p/5821879.html
一、package.json解釋:
package.json是用來(lái)聲明項(xiàng)目中使用的模塊,
這樣新的環(huán)境部署時(shí)牛隅,只要在package.json文件所在的目錄執(zhí)行npm install就可以安裝新的所需要的模塊了蒋搜。
{
"name": "angular-phonecat",
/name 是必須的字段不要在name中含有node新荤,js等字樣;
名字最終會(huì)是url的一部分夭拌,命令行的參數(shù)饺蚊,目錄名不能以點(diǎn)號(hào)或者下劃線開頭
名字可能在require()方法中被調(diào)用挣跋,所以要盡可能的短三圆。/
"private": true,
/private設(shè)置為true,npm會(huì)拒絕發(fā)布避咆,這樣會(huì)防止私有的repositories不小心被發(fā)布出去舟肉。/
"version": "0.0.0",
/version也是必須字段。/
"description": "A tutorial application for AngularJS",
/description是可選字段查库,npm search的時(shí)候會(huì)用到的路媚。/
"repository": {
"type": "git",
"url": "https://github.com/tiandashu/nodetest.git"
},
/repository是可選字段,用來(lái)指示代碼存放的位置樊销。/
"license": "MIT",
/可選的字段整慎,如果是使用一個(gè)普遍的license,比如BSD-3-Clause或MIT围苫,直接使用:
{ "license" : "BSD-3-Clause" }/
"devDependencies": {
//devDependencies是可選的字段可選字段裤园。如果只需要下載使用某些模塊,而不下載這些模塊的測(cè)試和文檔框架剂府,放在這個(gè)下面比較不錯(cuò)拧揽。
//感覺(jué)和Dependencies差不多,是指當(dāng)前包所以來(lái)的其他包
//版本的格式可以使version完全匹配,>,>=,<,<=這個(gè)版本,~Version接近這個(gè)版本淤袜,^version兼容這個(gè)版本等
//1.2.x X代表任意數(shù)字痒谴,因此1.2.1, 1.2.3等都可以
"bower": "^1.7.7",包管理器
"http-server": "^0.9.0",輕量級(jí)Web服務(wù)器
"jasmine-core": "^2.4.1",
"karma": "^0.13.22",用于運(yùn)行單元測(cè)試
"karma-chrome-launcher": "^0.2.3",
"karma-firefox-launcher": "^0.1.7",
"karma-jasmine": "^0.3.8",
"protractor": "^3.2.2"運(yùn)行端到端的測(cè)試
},
/scripts是可選的字段,實(shí)際上指的是npm-scripts铡羡。
npm run為每條命令提供了pre-和post-兩個(gè)鉤子(hook)积蔚。/
"scripts": {
"postinstall": "bower install",
/3最后運(yùn)行 postinstall是指install任務(wù)完成之后會(huì)執(zhí)行postinstall任務(wù)/
"prestart": "npm install",
/1先運(yùn)行 prestart是指先執(zhí)行prestart任務(wù)再執(zhí)行start任務(wù)。/
"start": "http-server ./app -a localhost -p 8000 -c-1",
/2再運(yùn)行/
"pretest": "npm install",
"test": "karma start karma.conf.js",
"test-single-run": "karma start karma.conf.js --single-run",
"preupdate-webdriver": "npm install",
"update-webdriver": "webdriver-manager update",
"preprotractor": "npm run update-webdriver",
"protractor": "protractor e2e-tests/protractor.conf.js",
"update-index-async": "node -e "var fs=require('fs'),indexFile='app/index-async.html',loaderFile='app/bower_components/angular-loader/angular-loader.min.js',loaderText=fs.readFileSync(loaderFile,'utf-8').split(/sourceMappingURL=angular-loader.min.js.map/).join('sourceMappingURL=bower_components/angular-loader/angular-loader.min.js.map'),indexText=fs.readFileSync(indexFile,'utf-8').split(/\/\/@@NG_LOADER_START@@[\s\S]*\/\/@@NG_LOADER_END@@/).join('//@@NG_LOADER_START@@\n'+loaderText+' //@@NG_LOADER_END@@');fs.writeFileSync(indexFile,indexText);""
}
}
/從上面可以看出蓖墅,運(yùn)行npm start之前都會(huì)運(yùn)行npm install库倘,然后start運(yùn)行"http-server ./app -a localhost -p 8000 -c-1
啟動(dòng)一個(gè)服務(wù)器。最后運(yùn)行的是bower install安裝bower管理的包论矾。/
/依賴的插件默認(rèn)安裝在生成的node_modules目錄里面/
二、bower相關(guān):存放在bower_components里面
bower install <package>
/*把 bower install packages 建立在bower_components里面,
一個(gè)package可以是一個(gè)url杆勇,一個(gè)github shorthand 贪壳,一個(gè)git endpoint等。
例如:
installs the project dependencies listed in bower.json(這是注釋)
$ bower install
registered package
$ bower install jquery
GitHub shorthand
$ bower install desandro/masonry
Git endpoint
$ bower install git://github.com/user/package.git
URL
bower init建立一個(gè)bower.json蚜退,?$ bower install PACHAGE --save保存新建的bower.json
使用use packages闰靴,<script src="bower_components/jquery/dist/jquery.min.js"></script>*/
bower.json內(nèi)容:
{
"name": "angular-phonecat",
"description": "A starter project for AngularJS",
"version": "0.0.0",
"homepage": "https://github.com/angular/angular-phonecat",
"license": "MIT",
"private": true,
"dependencies": {
"angular": "1.5.x",
"angular-animate": "1.5.x",
"angular-mocks": "1.5.x",
"angular-resource": "1.5.x",
"angular-route": "1.5.x",
"bootstrap": "3.3.x",
"jquery": "2.2.x"
}
}
/依賴的插件默認(rèn)安裝在生成的bower_components目錄里面;但是可以在.bowerrc中重新指定插件目錄/、
/*.bowerrc中的配置方式
{
"directory": "plugs"
}
*/
三钻注、http-server介紹:
/http-server是一個(gè)簡(jiǎn)單的零配置命令行http服務(wù)器蚂且,基于node.js。
在命令行的使用:$node http-server/
/在package.json中定義的方式:/
"scripts":{
"start":"http-server -a 0.0.0.0 -p 8000",
}
其中的參數(shù):
-p 端口號(hào) (默認(rèn) 8080)
-a IP 地址 (默認(rèn) 0.0.0.0)
-d 顯示目錄列表 (默認(rèn) 'True')
-i 顯示 autoIndex (默認(rèn) 'True')
-e or --ext 如果沒(méi)有提供默認(rèn)的文件擴(kuò)展名(默認(rèn) 'html')
-s or --silent 禁止日志信息輸出
--cors 啟用 CORS
-o 在開始服務(wù)后打開瀏覽器
-h or --help 打印列表并退出
-c 為 cache-control max-age header 設(shè)置Cache time(秒) 幅恋,禁用 caching, 則值設(shè)為 -1 .