任务目标为可以通过浏览器访问到相应的 html 以及 js css 文件.

首先还是从 hello world 开始

var express = require('express');
var app = express();
app.get('/', function (req, res) {res.send('Hello World!');
});
app.listen(8081, function () {console.log('Example app listening on port 8081!');
});

这样通过浏览器访问 localhost:8081 时就会收到 hello world.

访问自已的 html

上面的 hello world 虽然浏览器能访问到, 但离自已的 HTML 还有一段距离要走, 并且只是 exppress 也达不到此功能, 如果自已来一个一个添加代码的话工作量就大了, 还好可以利用自动生成 express 工具. 安装 npm install -g express-generator, 然后再运行express myproject 即可以当前 cmd pwd 目录生成一个以 myproject 为命名的项目, 然后我们要做的事情就是在这个项目上进行修改.

修改 package.json

我是直接复制 express 自动生成器里的 package.json 到新的目录, 然后修改成下面这个样子

{
  "name": "myweb",
  "version": "0.0.0",
  "private": true,
  "scripts": {"start": "node app.js"},
  "dependencies": {
    "debug": "~2.6.0",
    "express": "~4.14.1",
    "serial": "*"
  }
}

app.js

首先准备好 index.html 文件以及它的 jpeg css js 文件,css 与 js 等文件放到 public 文件夹, 然后编写

var express = require('express');
//var SerialPort = require("serialport"); // 引入串口模块
var path = require('path');             // 引入 path 模块
var fs = require('fs');                 // 引入 fs 模块
var app = express();                    // 创建 express 实例

app.use(express.static(path.join(__dirname, 'public'))); // 设置 public 文件夹为静态资源文件夹, 必须建立否则 js 和 css 无法加载
app.get('/', function (req, res) {res.sendFile(__dirname + '/index.html');
});   // 设置路由，当客户端请求 '/' 时，发送文件 index.html
app.listen(8081, function () {console.log('Example app listening on port 8081!');
});

然后 npm start 就可以通过浏览器访问到我们创建的 html 文件了