节点提供的ejs文件可以使用脱机引导吗? [英] Can node presented ejs files use offline bootstrap?

查看:85
本文介绍了节点提供的ejs文件可以使用脱机引导吗?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是节点和全栈开发的新手,希望我能针对您的特定理解水平而正确而又不粗心地或冒犯地询问这一点.

I'm new to node and full stack development and hope I ask this correctly and not carelessly or offensively for your particular level of understanding.

我的开发环境已连接Internet,无法进行生产,因此我想在节点上使用bootstrap.css.在生产环境中,不能选择Apache/httpd.

My dev environment is Internet connected, production will not be and I want to use bootstrap.css with node. Apache/httpd is not an option in production.

在本地测试引导程序具有挑战性,可以认为css文件的正确目录是正确的.

Testing bootstrap locally has been challenging, the correct directory for the css file is believed correct.

CENTOS 7上的主目录是myapp,包含app0.js,带有espress和body-parser以及所有依赖项的node_modules和包含grid.ejs的views目录.

The main directory on CENTOS 7 is myapp, contains app0.js, the node_modules with espress and body-parser and all dependencies, and the views directory which contains grid.ejs.


myapp/
    app0.js
    node_modules
    views/
        grid.ejs
    public/
        bootstrap.css

这是grid.html(适用于Apache):

Here is grid.html (which works on apache):

<!DOCTYPE html>
<html>

<head>
  <title>Bootstrap Grid Test</title>
  <link rel="stylesheet" type="text/css" href="bootstrap.css">

  <style type="text/css">
    .pink {
      background: yellow;
      border: 3px solid red;
  </style>  
</head>

<body>
  <div class="row">
    <div class="col-lg-2 pink"><center>2 columns </center></div>
    <div class="col-lg-7 pink"><center>7 columns </center></div>
    <div class="col-lg-3 pink"><center>3 columns </center></div>
  </div>

</body>

</html>

这是apache为grid.html显示的内容:

And here is what apache shows for grid.html:

https://imgur.com/VanVZJn 使用httpd启动"

https://imgur.com/VanVZJn "bootstrap with httpd"

但是app0.js却没有!

However app0.js does not!

因此bootstrap.css可以在Internet上引用时工作(1)-我无法在开发环境中通过http代码从httpd在生产中使用(2) 但不是来自ejs文件.

So bootstrap.css works (1) when referenced on internet - which I cannot use in production (2) from httpd in my dev environment via http code but not from an ejs file.

注意:我能够从节点到达引导程序,因为从启动节点的终端无法显示时有404错误.经过至少12个小时的尝试来理解这一点后,我很沮丧.遗憾的是,由于时间紧迫,我们无法找到解决方案,我向您推荐优秀的读者!

Note: I am able to reach bootstrap from node, because there were 404 errors when it was not reachable showing from the terminal where node was launched. After at least 12 hours trying to understand this, I'm stumped. Sadly with a short timeline to have a solution, I turn to you fine readers!

App0.js //设置

App0.js //setup

var express = require('express'),
    app = express(),
    bodyParser = require('body-parser')

app.set('view engine','ejs');
app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())

app.get("/grid", function(req, res, next){
    res.render("grid")
});

app.listen(3000,function(){
    console.log("serving test demo on port 3000")
});

views/grid.ejs

views/grid.ejs

<!DOCTYPE html>
<html>

<head>  
  <title>Bootstrap Grid System</title>
  <meta charset="UTF-8">
  <link rel="stylesheet" type="text/css" href="public/bootstrap.css">
  <style type="text/css">
      .pink {
          background: yellow;
          border: 3px solid red;
       }  
  </style>
</head>

<body>
    <div class="row">
        <div class="col-lg-2 pink"><center>2</center></div>
        <div class="col-lg-7 pink"><center>7</center></div>
        <div class="col-lg-7 pink"><center>3</center></div>
    </div>

</body>

</html>

显示在这里:

https://imgur.com/ZLOgZKT 引导程序不起作用"

https://imgur.com/ZLOgZKT "bootstrap not working"

推荐答案

您必须在app0.js文件上定义要用于提供静态文件的public路径.尝试以下需要使用path模块并在bodyParser.json()之后使用express.static的app0.js文件:

You have to define on your app0.js file the public path from where you are going to serve static files. Try the following app0.js file requiring the path module and using express.static after bodyParser.json():

var express = require('express'),
    app = express(),
    bodyParser = require('body-parser'),
    path = require('path')

app.set('view engine','ejs');
app.use(bodyParser.urlencoded({ extended: false }))
app.use(bodyParser.json())
app.use(express.static(path.join(__dirname, 'public')));

app.get("/grid", function(req, res, next){
    res.render("grid")
});

app.listen(3000,function(){
    console.log("serving test demo on port 3000")
});


然后您的grid.ejs文件以这种方式链接引导文件:


And your grid.ejs file link the bootstrap file this way:

<link rel="stylesheet" type="text/css" href="/bootstrap.css">

这篇关于节点提供的ejs文件可以使用脱机引导吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆