Я хотел бы знать, понял ли я работу connect-flash / bootstrap / session.Я вижу, что флэш-сообщения появляются, как и ожидалось.Мой вопрос касается цветов, связанных с «успехом» и «опасностью».Хотя сообщения отображаются ожидаемым образом, я не вижу связанных цветов,
Ниже приведены биты package.json,
{
"dependencies": {
"body-parser": "^1.18.3",
"bootstrap": "^4.1.3",
"connect-flash": "^0.1.1",
"cookie-parser": "^1.4.3",
"express": "^4.16.4",
"express-messages": "^1.0.1",
"express-session": "^1.15.6",
"express-validator": "^5.3.0",
"mongoose": "^5.3.15",
"pug": "^2.0.3"
},
"devDependencies": {
"nodemon": "^1.18.7"
}
}
В моем app.js,
const express = require('express');
const path = require('path');
const mongoose = require('mongoose');
const bodyParser = require('body-parser');
const cookieParser = require('cookie-parser');
const expressValidator = require('express-validator');
const flash = require('connect-flash');
const session = require('express-session');
// express session middleware
app.use(session({
secret: 'keyboard cat',
resave: true,
saveUninitialized: true
}));
// express messages middleware
app.use(require('connect-flash')());
app.use(function (req, res, next) {
res.locals.messages = require('express-messages')(req, res);
next();
});
app.use(flash());
// my routes
let quotes = require('./routes/quotes');
let subscribers = require('./routes/subscribers');
app.use('/quotes', quotes);
app.use('/subscribers', subscribers);
// In my subscribers route,
router.post('/subscribe', function (req, res)
{
// logic to save to my database here
req.flash('success', 'Subscription confirmed.');
res.redirect('back');
});
В моем файле services.pug у меня есть,
link(rel='stylesheet', href='/css/style.css')
link(rel='stylesheet' href='/node_modules/bootstrap/dist/css/bootstrap.css')
// other code in here
.container
h1 Subscribe to our newsletter
//- include subscribe.pug
form(method='POST', action= '/subscribe')
input(name = 'email',type='email', placeholder='Enter email')
button.button1(type='submit') Subscribe
!= messages('message',locals)
// at the bottom
script(src='/node_modules/jquery/dist/jquery.js')
script(src='/node_modules/bootstrap/dist/js/bootstrap.js')
В моем message.pug у меня есть,
.messages
each type in Object.keys(messages)
each message in messages[type]
div(class = "alert alert-"+ type) #{message}
Как я уже говорил выше, сообщения появляются, как и ожидалось.Но я не вижу зеленый цвет, связанный с успехом, и красный для опасности, как я видел в учебнике, которому я следовал.Я просто вижу сообщение, смешанное с цветом фона страницы.Я хотел бы знать, что мне не хватает.
ОБНОВЛЕНИЕ
При проверке консоли на Chrome я нашел прикрепленные сообщения об ошибках.Я также включил структуру каталогов проекта.Bootstrap.css и jquery.js не обнаруживаются приложением.
Здесь я устанавливаю свою общую папку в app.js,
// set public folder
app.use(express.static(path.join(__dirname, 'public')));
Также доступна папка node_modules.
Спасибо