我有一个基本的Node.js应用程序,我试图使用Express框架启动。我有一个views文件夹,其中有一个index.html文件。但是我在加载网页时收到以下错误:

Error: Cannot find module 'html'

下面是我的代码。

var express = require('express');
var app = express.createServer();

app.use(express.staticProvider(__dirname + '/public'));

app.get('/', function(req, res) {
    res.render('index.html');
});

app.listen(8080, '127.0.0.1')

我错过了什么?


当前回答

我想允许对“/”的请求由Express路由处理,而以前它们是由静态中间件处理的。这将允许我渲染index.html的常规版本或加载连接+最小化JS和CSS的版本,这取决于应用程序设置。受到Andrew Homeyer回答的启发,我决定将我的HTML文件(未修改)拖到views文件夹中,并像这样配置Express

   app.engine('html', swig.renderFile);
   app.set('view engine', 'html');
   app.set('views', __dirname + '/views');  

创建了一个这样的路由处理器

 app.route('/')
        .get(function(req, res){
            if(config.useConcatendatedFiles){
                return res.render('index-dist');
            }
            res.render('index');       
        });

结果很好。

其他回答

我通常用这个

app.configure(function() {
    app.use(express.static(__dirname + '/web'));
});

只是要小心,因为它会共享/web目录中的任何内容。

我希望这对你们有帮助

来自Express.js指南:视图渲染

视图文件名采用Express形式。ENGINE,其中ENGINE是所需模块的名称。例如视图布局。Ejs会告诉视图系统require(' Ejs '),被加载的模块必须导出方法exports。render(str, options)来遵守Express,但是app.register()可以用来将引擎映射到文件扩展名,因此,例如foo.html可以由jade渲染。

所以你要么创建自己的简单渲染器,要么使用jade:

 app.register('.html', require('jade'));

更多关于app.register的信息。

注意,在Express 3中,这个方法被重命名为app.engine

It is very sad that it is about 2020 still express hasn't added a way to render an HTML page without using sendFile method of the response object. Using sendFile is not a problem but passing argument to it in the form of path.join(__dirname, 'relative/path/to/file') doesn't feel right. Why should a user join __dirname to the file path? It should be done by default. Why can't the root of the server be by defalut the project directory? Also, installing a templating dependency just to render a static HTML file is again not correct. I don't know the correct way to tackle the issue, but if I had to serve a static HTML, then I would do something like:

const PORT = 8154;

const express = require('express');
const app = express();

app.use(express.static('views'));

app.listen(PORT, () => {
    console.log(`Server is listening at port http://localhost:${PORT}`);
});

The above example assumes that the project structure has a views directory and the static HTML files are inside it. For example, let's say, the views directory has two HTML files named index.html and about.html, then to access them, we can visit: localhost:8153/index.html or just localhost:8153/ to load the index.html page and localhost:8153/about.html to load the about.html. We can use a similar approach to serve a react/angular app by storing the artifacts in the views directory or just using the default dist/<project-name> directory and configure it in the server js as follows:

app.use(express.static('dist/<project-name>'));

你也可以读取HTML文件并发送它:

app.get('/', (req, res) => {
    fs.readFile(__dirname + '/public/index.html', 'utf8', (err, text) => {
        res.send(text);
    });
});

试试这个。这对我很管用。

app.configure(function(){

  .....

  // disable layout
  app.set("view options", {layout: false});

  // make a custom html template
  app.register('.html', {
    compile: function(str, options){
      return function(locals){
        return str;
      };
    }
  });
});

....

app.get('/', function(req, res){
  res.render("index.html");
});