有了解nodejs的童鞋們知道，nodejs有很多的依賴，那么我們在新建一個項目的時候，如何快速的導入這些依賴從而創(chuàng)建一個nodejs項目呢，接下來會詳細介紹。
這里安利一個前端開發(fā)工具——webstorm。真的很好用，除了有點（或許不是一點點）占內(nèi)存，打開的時候有點慢。在工作中用這個會很方便（在考慮要不要寫一篇前端開發(fā)工具的比較，吼吼吼_(≧▽≦)/）

?下面我們來用命令創(chuàng)建一個nodejs項目。

1.我們在c盤的ws文件夾下創(chuàng)建項目。
打開DOS窗口,進入到ws文件夾
>cd c:\ws
2.在此文件夾下創(chuàng)建名為nodeProjection1的項目
>express --view=ejs nodeProjection1

3.進入項目文件夾，安裝依賴
>cd nodeProjection1
> npm install

Paste_Image.png

Paste_Image.png

然后選擇一個開發(fā)工具，打開剛創(chuàng)建的項目。如下圖。node_modules里面有很多依賴模塊，遠遠不止你看到的。

Paste_Image.png

Paste_Image.png

?下面詳細解釋一下，項目中各個目錄的功能用途，

app.js:——啟動文件，也可以說是主文件入口。
package.json——定義了這個項目所需要的各種模塊，以及項目的配置信息（比如名稱、版本、許可證等元數(shù)據(jù)）。npm install命令根據(jù)這個配置文件，自動下載所需的模塊，也就是配置項目所需的運行和開發(fā)環(huán)境。

node_modules——存放package.json中安裝的模塊，當你在package.json添加依賴的模塊并安裝后，存放在這個文件夾下

public——存放image、css、js等文件
routes——存放路由文件
views——存放視圖文件或者說模板文件
bin——存放可執(zhí)行文件

?app.js里的代碼及其解釋

  var express = require('express');
  var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');

var index = require('./routes/index');
var users = require('./routes/users');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', index);
app.use('/users', users);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
    res.status(err.status || 500);
  res.render('error');
});

module.exports = app;

1. 這里我們通過require()加載了express、path 等模塊,以及 routes 文件夾下的index. js和 users.js 路由文件。 下面來講解每行代碼的含義。

2.var app = express(); 生成一個express實例。app.

3.app.set('views', path.join(__dirname, 'views'))；設置views文件夾為存放視圖文件的目錄，即存放模板文件的目錄。_dirname為全局變量，存儲當前正在執(zhí)行的腳本所在的目錄。

4.app.set('view engine', 'ejs'); 設置視圖模板引擎為ejs。

5.app.use(logger('dev’))：加載日志中間件。

6.app.use(bodyParser.json())：加載解析json的中間件。

7.app.use(bodyParser.urlencoded({ extended: false }));
加載解析urlencoded請求體的中間件。

8.app.use(cookieParser())：加載解析cookie的中間件。

9.app.use(express.static(path.join(__dirname, 'public')))：設置public文件夾為存放靜態(tài)文件的目錄。

10.app.use('/', index);和app.use('/users', users)：路由控制器。

11.app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
捕獲404錯誤，并轉發(fā)到錯誤處理器。

12.app.use(function(err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};

// render the error page
res.status(err.status || 500);
res.render('error');
});
開發(fā)環(huán)境下的錯誤處理器，將錯誤信息渲染error模版并顯示到瀏覽器中。

13.module.exports = app;：導出app實例供其他模塊調(diào)用。

?bin/www代碼及其詳解

#!/usr/bin/env node    
  /**
 * Module dependencies.
 */

  var app = require('../app');
var debug = require('debug')('nodeproject1:server');
var http = require('http');

/**
 * Get port from environment and store in Express.
 */

var port = normalizePort(process.env.PORT || '3000');
app.set('port', port);

/**
 * Create HTTP server.
 */

var server = http.createServer(app);

/**
 * Listen on provided port, on all network interfaces.
 */

server.listen(port);
server.on('error', onError);
server.on('listening', onListening);

/**
 * Normalize a port into a number, string, or false.
 */

function normalizePort(val) {
  var port = parseInt(val, 10);

  if (isNaN(port)) {
// named pipe
return val;
  }

  if (port >= 0) {
// port number
return port;
  }

  return false;
}

/**
 * Event listener for HTTP server "error" event.
 */

function onError(error) {
  if (error.syscall !== 'listen') {
throw error;
    }

  var bind = typeof port === 'string'
? 'Pipe ' + port
: 'Port ' + port;

  // handle specific listen errors with friendly messages
  switch (error.code) {
case 'EACCES':
  console.error(bind + ' requires elevated privileges');
  process.exit(1);
  break;
case 'EADDRINUSE':
  console.error(bind + ' is already in use');
  process.exit(1);
  break;
default:
  throw error;
  }
}

/**
 * Event listener for HTTP server "listening" event.
 */

function onListening() {
  var addr = server.address();
  var bind = typeof addr === 'string'
    ? 'pipe ' + addr
    : 'port ' + addr.port;
  debug('Listening on ' + bind);
}

1.#!/usr/bin/env node：表明是 node 可執(zhí)行文件。

2.var debug = require('debug')('nodeproject1:server');：引入debug模塊，打印調(diào)試日志。

3.var app = require('../app’)：引入我們上面導出的app實例。

4.var port = normalizePort(process.env.PORT || '3000');
app.set('port', port); 設置端口號。

5.剩下的代碼用來啟動工程并監(jiān)聽3000端口。

?routes/index.js

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

module.exports = router;

生成一個路由實例用來捕獲訪問主頁的GET請求，導出這個路由并在app.js中通過app.use('/', routes); 加載。這樣，當訪問主頁時，就會調(diào)用res.render('index', { title: 'Express' });渲染views/index.ejs模版并顯示到瀏覽器中。

?views/index.ejs

<!DOCTYPE html>
<html>
    <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <h1><%= title %></h1>
    <p>Welcome to <%= title %></p>
  </body>
</html>

在渲染模板時我們傳入了一個變量 title 值為 express 字符串，模板引擎會將所有 <%= title %> 替換為 express ，然后將渲染后生成的html顯示到瀏覽器中。

?(°?‵?′??)半個下午的時間又出了一篇，多多喜歡，多多點贊啊 O(∩_∩)O謝謝

啦啦啦，我是快樂的程序媛.gif