Question

我在服务器端有一个nodejs应用程序，在客户端有vue应用程序

我希望我的服务器端在访问某些URL（例如'/'）时为我的客户端提供服务

我的客户端在project_root/frontend下，我的服务器在project_root/server下

这是我的server/app.js文件：

const webpackConfig = require('./webpack.config.js')
const webpack = require('webpack');
const webpackMiddleware = require('webpack-dev-middleware');
const compiler = webpack(webpackConfig);

const app = express();

if(process.env['FUNDME_DEV']) {
  app.use(webpackMiddleware(compiler, {
    publicPath: path.join(__dirname, '/../frontend/dist')
  }))
} else {
  //production
  app.use(express.static(path.join(__dirname, '/../frontend/dist')));
}
app.listen(port, () => {
  console.log(`server started, listening on port ${port}`)
})

我的webpack.config.js文件大部分是猜测，是从我创建前端时为我创建的vue-cli复制而来的，因此可能是错误的，但是在开发人员模式下运行服务器时的输出（{{ 1}}）表示编译成功。

但是，当我尝试访问我的应用程序时，出现“无法获取/”的消息，中间件没有任何作用：（

我不知道我缺少什么，或者我的webpack配置看起来如何，我发现其他类似问题都没有帮助。

我该怎么办？

Answer 1

const webpackConfig = require('./webpack.config.js')
const webpack = require('webpack');
const webpackMiddleware = require('webpack-dev-middleware');
const compiler = webpack(webpackConfig);

const app = express();

if(process.env.NODE_ENV === 'development') { // you don't have to compile the content first, just start this as dev.
  app.use(webpackMiddleware(compiler, {
    publicPath: '/' // <--- this has to be the same publicPath that you inserted on your webpack config, otherwise you could leave this as /
  }))
} else {
  //production
  app.use(express.static(path.join(__dirname, '/../frontend/dist')));
}
app.listen(port, () => {
  console.log(`server started, listening on port ${port}`)
})

webpack-dev-middleware无法为我的客户提供服务

1 个答案: