express+webpack+ejs 运行报错
我的目录
package.json 如下：
.....
"scripts": {
"server": "node ./bin/www",
"build": "webpack",
"start": "webpack-dev-server --open"
},
.....webpack.config.js如下：
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
module.exports = {
mode: 'development',
entry: {
app: './public/js/index.js'
},
devtool: 'inline-source-map',
plugins: [
new CleanWebpackPlugin(['dist']),
new UglifyJsPlugin({
test: /\.js($|\?)/i,
uglifyOptions: {
warnings: false,
sourceMap: true,
output: {
beautify: false,
comments:false,
}
}
}),
new HtmlWebpackPlugin({
filename: 'index.html',
template: './views/index.ejs',
title:'aaa',
minify: {
collapseWhitespace: true,
removeAttributeQuotes: true,
removeComments: true
}
}),
new webpack.HotModuleReplacementPlugin()
],
output: {
filename: '[name].bundle.js',
path: path.resolve(__dirname, 'dist'),
publicPath: '/dist'
}
};app.js 如下：
var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');
var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
var app = express();
var webpack = require('webpack');
var webpackconfig=require('./webpack.config.js');
var compiler = webpack(webpackconfig);
app.use(require('webpack-dev-middleware')(compiler, {
publicPath: webpackconfig.output.publicPath
}));
app.use(require('webpack-hot-middleware')(compiler,{
log: false,
heartbeat: 2000
}));
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', indexRouter);
app.use('/users', usersRouter);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
next(createError(404));
});
// error handler
app.use(function(err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {};
// render the error page
res.status(err.status || 500);
res.render('error');
});
module.exports = app;
app.listen(90, function () {
console.log(`http://localhost:${90}`);
});
process.on('exit', function (code) {
console.log(`即将退出，退出码：${code}`);
});
process.on('uncaughtException', (err) => {
console.log(err, 'err')
});index.ejs 如下：
<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<link rel='stylesheet' href='/css/style.css' />
</head>
<body>
<h1><%= title %></h1>
<p>Welcome to <%= title %></p>
<script src="/dist/app.bundle.js"></script>
</body>
</html>
运行 npm run server 后 ，报错，如图：
index.ejs里 title 报错 未定义，初次尝试express 和 webpack，在本站搜过相关问题，未能找到解决办法，所以有此一问，请问该如何解决？
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论