如何全局安裝一個(gè) node 應(yīng)用?
npm install -g pkg
package.json 有什么作用?
每個(gè)項(xiàng)目的根目錄下面,一般都有一個(gè)package.json文件,定義了這個(gè)項(xiàng)目所需要的各種模塊,以及項(xiàng)目的配置信息(比如名稱、版本、許可證等元數(shù)據(jù))。npm install命令根據(jù)這個(gè)配置文件,自動(dòng)下載所需的模塊,也就是配置項(xiàng)目所需的運(yùn)行和開發(fā)環(huán)境。
(npm init)
package.json字段全解
package.json文件
npm install --save app 與 npm install --save-dev app有什么區(qū)別?
--save 會(huì)把依賴包名稱添加到 package.json 文件 dependencies 鍵下
--save-dev 則添加到 devDependencies 鍵下,只有開發(fā)測(cè)試項(xiàng)目的時(shí)候會(huì)用到,別人引用項(xiàng)目不會(huì)下載
node_modules的查找路徑是怎樣的?
例如:
// index.js
var marked = require('marked')
-demo
--node_modules
---bin
---marked
--index.js
先從當(dāng)前所在文件夾demo的node_modules里找marked,找不到就依次到上級(jí)目錄中的node_modules里面找,,直到系統(tǒng)根目錄。
npm3與 npm2相比有什么改進(jìn)?yarn和 npm 相比有什么優(yōu)勢(shì)?
webpack是什么?和其他同類型工具比有什么優(yōu)勢(shì)?
webpack是一個(gè)模塊加載器和打包工具,它可以將許多松散的模塊按照依賴和規(guī)則打包成符合生產(chǎn)環(huán)境部署的前端資源。還可以將按需加載的模塊進(jìn)行代碼分隔,等到實(shí)際需要的時(shí)候再異步加載。通過 loader 的轉(zhuǎn)換,任何形式的資源都可以視作模塊,比如 CommonJs 模塊、 AMD 模塊、 ES6 模塊、CSS、圖片、 JSON、Coffeescript、 LESS 等。
優(yōu)勢(shì):
對(duì)CommonJS、AMD、ES6的語法兼容
對(duì)js、css、圖片等資源文件都支持打包
串聯(lián)式模塊加載器以及插件機(jī)制,讓其具有更好的靈活性和擴(kuò)展性,例如提供對(duì)CoffeeScript、ES6的支持
有獨(dú)立的配置文件webpack.config.js
可以將代碼切割成不同的chunk,實(shí)現(xiàn)按需加載,降低了初始化時(shí)間
支持 SourceUrls 和 SourceMaps,易于調(diào)試
具有強(qiáng)大的Plugin接口,大多是內(nèi)部插件,使用起來比較靈活
webpack 使用異步 IO 并具有多級(jí)緩存。這使得 webpack 很快且在增量編譯上更加快
npm script是什么?如何使用?
npm script允許在package.json中使用scripts字段定義腳本命令
//package.json
{
...
"scripts": {
"start": "webpack" //npm start
"server": "webpack-dev-server --open" //npm run server
},
...
}
使用 webpack 替換 requriejs
gulp是什么?使用 gulp 實(shí)現(xiàn)圖片壓縮、CSS 壓縮合并、JS 壓縮合并
在Javascript的開發(fā)過程中,經(jīng)常會(huì)遇到一些重復(fù)性的任務(wù),比如合并文件、壓縮代碼、檢查語法錯(cuò)誤、將Sass代碼轉(zhuǎn)成CSS代碼等等。通常,我們需要使用不同的工具,來完成不同的任務(wù),既重復(fù)勞動(dòng)又非常耗時(shí)。grunt,gulp都是為了解決這個(gè)問題而發(fā)明的工具,可以幫助我們自動(dòng)管理和運(yùn)行各種任務(wù),很多人認(rèn)為,在操作上,它要比Grunt簡(jiǎn)單。
//gulpfile.js
var gulp = require('gulp'),
imagemin = require('gulp-imagemin'), //圖片壓縮
concat = require('gulp-concat'), //文件合并
cssnano = require('gulp-cssnano'), //css壓縮
uglify = require('gulp-uglify') //js壓縮
gulp.task('imgtest', function(){
gulp.src('src/img/*')
.pipe(imagemin())
.pipe(gulp.dest('dist/img/'))
})
gulp.task('csstest', function(){
gulp.src('src/css/*')
.pipe(concat("merge.css"))
.pipe(cssnano())
.pipe(gulp.dest('dist/css/'))
})
gulp.task('jstest', function(){
gulp.src('src/css/*')
.pipe(concat('merge.js'))
.pipe(uglify())
.pipe(gulp.dest('dist/js/'))
})
gulp.task('default', ['imgtest', 'csstest', 'jstest'])
開發(fā)一個(gè) node 命令行天氣應(yīng)用用于查詢用戶當(dāng)前所在城市的天氣,發(fā)布到 npm 上去。
npm install -g weather-peacechierdo
weather