Question

基本上我有两个路由，其中快递一个用于主页，另一个用于管理页面，但我找不到关于如何组合Vuejs和Express的良好文档，因此我可以同时服务两个页面，假设两者都有不同的UI，所以组件的构造不一样。

Answer 1

要使用expressjs提供静态文件，您需要使用static middleware。

它接受目录名作为第一个参数。该目录应包含要提供的所有静态文件。

const express = require('express');
let app = express();
app.use(express.static('public')); // NAME OF THE DIRECTORY IS PUBLIC

const serverPort = 3000;

const respHttpOptions = {
    root: `public/`,
    dotfiles: 'deny',
    headers: {
        'dina-timestamp': Date.now(),
        'my-xxx-header': true
    }
};
app.get('/', (req, resp) => { // HANDLE THE REQUEST HERE
    resp.sendFile('index.html', respHttpOptions, (err) => {
        // SEND INDEX.HTML INSIDE PUBLIC DIRECTORY
        if (!err)
            console.log(sucL(`Served index.html`));
        else
            console.log(errL(`Failed to serve index.html ${err}`));
    })
});

try {
    app.listen(serverPort);
    console.log(sucL(`Server started at ${serverPort}`));
} catch (e) {
    console.log(errL(e));
}

vuejs没有区别！您可以在静态目录中拥有多个目录。

Answer 2

要使用vue-router并避免遇到404问题，您的express.js必须有一个为index.html服务的后备广告。以下是有关如何执行此操作的vue指南https://router.vuejs.org/en/essentials/history-mode.html

如何从我的节点/快速服务器提供我的Vuejs前端文件？

2 个答案: