nodejs入门篇---创建project并具体解释

想了非常久。总想写点对大家有优点的，今天解说生成项目。

如今市面上一般须要人全栈-----mean（mongo，express。angular，nodejs），这样能够从前端开发到后端以及数据库，听起来牛呼呼的。

这篇文章就说nodejs和比較流行的框架express4.X版本号（因为3.X版本号没怎么研究过。并且和4有一定差别。况且4也出来非常久了。非用不可啊），后面的文章会带上mongo（oh。应该说是mongoose）至于angualr我有独立的研究过。和nodejs之流放在一起用还没搞过，还是看实际情况吧。

这篇文章就写个生成项目（页面就用ejs，对jade木有还没研究，不能坑了大伙）

众所周知，一个project肯定有非常多目录以及文件。那么怎么高速生成开发框架呢。两种方式，第一是使用工具，我用的是webstorm，另一个是语法，用命令操作到工作空间，然后运行命令 express -e aTest（当中-e就是指ejs。aTest是project名。也是最上层的目录名），为了可以形象化截图。我们还是用工具生成。

1：new一个project，各种开发都是从这里開始的

2：选nodeproject

3：选版本和驱动面板，版本不改，驱动面板改成ejs。点击ok

因为我们本地已经安装了nodejs。所以我们点击cancel

这样，一个nodejsproject生成了。例如以下图

文件夹解释：

app.js：启动文件，或者说入口文件

package.json：存储着project信息以及模板依赖，当在dependencies中加入依赖的模块时。执行npm install，nmp会检查当前文件夹下的package.json，并自己主动安装全部指定的模块

node_modules：存放package.json中安装的模块，当你在package.json加入依赖的模块并安装后，存放在这个目录下

public：存放image、css、js等文件

routes：存放路由文件

views：存放视图文件或者说模板文件

bin：存放可运行文件

打开app.js

<span style="font-size:14px;">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 routes = 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(__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('/', routes);

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 handlers

// development error handler

// will print stacktrace

if (app.get('env') === 'development') {

  app.use(function(err, req, res, next) {

    res.status(err.status || 500);

    res.render('error', {

      message: err.message,

      error: err

    });

  });

}

// production error handler

// no stacktraces leaked to user

app.use(function(err, req, res, next) {

  res.status(err.status || 500);

  res.render('error', {

    message: err.message,

    error: {}

  });

});

module.exports = app;

</span>

这里我们通过require()载入了express、path 等模块,以及 routes 目录下的index. js和 users.js 路由文件。以下来解说每行代码的含义。

(1) var app = express()：生成一个express实例 app。

(2)app.set('views', path.join(__dirname, 'views’))：设置 views 文件夹为存放视图文件的文件夹, 即存放模板文件的地方,__dirname 为全局变量,存储当前正在运行的脚本所在的文件夹。

(3)app.set('view engine', 'ejs’)：设置视图模板引擎为 ejs。

(4)app.use(favicon(__dirname + '/public/favicon.ico’))：设置/public/favicon.ico为favicon图标。

(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文件夹为存放静态文件的文件夹。

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

(11)

app.use(function(req, res, next) {

    var err = new Error('Not Found');

    err.status = 404;

    next(err);

});

捕获404错误，并转发到错误处理器。

(12)

if (app.get('env') === 'development') {

    app.use(function(err, req, res, next) {

        res.status(err.status || 500);

        res.render('error', {

            message: err.message,

            error: err

        });

    });

}

开发环境下的错误处理器，将错误信息渲染error模版并显示到浏览器中。

(13)

app.use(function(err, req, res, next) {

    res.status(err.status || 500);

    res.render('error', {

        message: err.message,

        error: {}

    });

});

生产环境下的错误处理器。将错误信息渲染error模版并显示到浏览器中。

(14)module.exports = app ：导出app实例供其它模块调用。

接下来再看看bin/www文件

#!/usr/bin/env node

/**

 * Module dependencies.

 */

var app = require('../app');

var debug = require('debug')('aTest: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 可运行文件。

(2)var debug = require('debug')('blog’)：引入debug模块。打印调试日志。

(3)var app = require('../app’)：引入我们上面导出的app实例。

(4)app.set('port', process.env.PORT || 3000)：设置端口号。

(5)

var server = app.listen(app.get('port'), function() {

  debug('Express server listening on port ' + server.address().port);

});

启动project并监听3000端口，成功后打印 Express server listening on port 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); 载入。

这样，当訪问主页时，就会调用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显示到浏览器中，如上图所看到的。

通过上面的知识。我们学习了怎样创建一个project并启动它。了解了project的大体结构和运作流程。下一篇讲路由。

。。

巴特西

nodejs入门篇---创建project并具体解释

最新文章

热门文章