如何在不改变文件结构的情况下使用EJS和Express访问 Bootstrap 文件?

y4ekin9u  于 2022-12-08  发布在  Bootstrap
关注(0)|答案(1)|浏览(165)

刚开始学习NodeJS。我正在使用EJS来包含公共视图,并使用express.static()为公共目录提供“style.css”。我正在使用CDN的 Bootstrap ,但现在我需要对变量(如原色等)进行一些更改。
我想保持我的文件结构为;

|-- node_modules/
|   |-- bootstrap
|   |   |
|   |   |--bootstrap stuff
|   |
|   |--other stuff
|
|-- public/
|   |-- css/
|   |   |-- style.css
|   |
|   |-- resources/
|
|-- views/
|   |-- partials
|   |   |--head.ejs
|   |
|   |--pages 
|      |--index.ejs  
|
|-- app.js
|-- package.json
|-- package-lock.json

我想停止使用CDN Bootstrap并链接我通过npm安装的bootstrap文件。如何访问node_modules下的bootstrap文件?
这里也是我的“app.js”;

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

const PORT = process.env.PORT || 80;

// set the view engine to ejs
app.set('view engine', 'ejs');

// use res.render to load up an ejs view file

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

// about page
app.get('/about', function(req, res) {
  res.render('pages/about');
});

// static pages for css and etc.
app.use(express.static(__dirname + '/public'));

app.listen(PORT, () => console.log('Server is listening at '+ PORT));

我知道类似的问题被问到here,但解决方案是从不同的目录或从cdn使用它。

6qfn3psc

6qfn3psc1#

在特定路由上以静态方式提供所需文件夹:

app.use('/mycdn', express.static(path.join(__dirname, 'node_modules/bootstrap')));

然后从该路由指向要加载资源:

href="/mycdn/style.css"

相关问题