1
  • Webpack 配置中的 publicPath 设置为/contents/dist/assets/
  • Express 中的视图文件使用handlebars

  • 在 Webpack 配置中，handlebars模板设置为输出正确的脚本标签/链接样式表..

    new HtmlWebpackPlugin({
  template: 'views/index.handlebars',
  filename: 'views/index.handlebars',
}),

    所以这也输出到文件夹/contents/dist/assets/下。views因此，/contents/dist/assets/views它将在哪里输出。

  • 在 Express 中，设置了一条路由来提供此文件。
    route.get('*', (req, res) => {
    res.render('index' .....)

而且...
- 我已经设置webpack-dev-middleware为资产服务

  const webpack = require('webpack');
  const webpackDevMiddleware = require('webpack-dev-middleware');
  const config = require('../../webpack.config');
  const compiler = webpack(config);

  const app = express();

  app.use(webpackDevMiddleware(compiler, config.devServer));
  • 我设置了一个new CleanWebpackPlugin()插件，在每次构建之前删除dist文件夹的内容，所以它从一个新的空文件夹开始。

这实际上是如何工作的？

Express 正在寻找我告诉它寻找的视图。

const viewsDir = resolve(__dirname, '../../client/views');
app.set('views', viewsDir);

当我运行 webpack 时，它会删除dist文件夹的内容，因此视图不存在。但是，不应该通过内存服务所有这些资产（HTML、 webpack-dev-middleware Handlebars等）吗？不是文件系统？当 Express 到达/路线时，没有视野可服务。

所有这些假设如何结合在一起并发挥作用？

4

0 回答 0