Vue资源无法加载快速静态文件

所以,我有一个问题。 这是我的server.js

require('dotenv').load(); const http = require('http'); const path = require('path'); const express = require('express'); const app = express(); const server = http.createServer(app).listen(8080, () => { console.log('Foliage started on port 8080'); }); app.use(express.static(path.join(__dirname, '/public'))); app.get('/', (req, res) => { res.sendFile(path.join(__dirname, 'index.html')); }); app.get('*', (req, res) => { res.sendFile(path.join(__dirname, 'index.html')); }); 

这是什么,是每一个/whatever它给了index.html文件。 除此之外,它还提供来自/public静态文件现在,我的index.html如下所示:

 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Foliage</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="css/foliage.css" media="screen" title="no title"> <script src="https://use.fontawesome.com/763cbc8ede.js"></script> </head> <body> <div id="app"> <router-view :key="$router.currentRoute.path"></router-view> </div> <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script> <script src="js/md5.js"></script> <script src="js/cookies.js"></script> <script src="js/dragula.js"></script> <script src="js/build.js"></script> </body> </html> 

所有的JS文件和样式文件都是从public/jspublic/css为此加载的。 然而,在build.js ,这是一个webpack-ed vuejs应用程序,我使用vue-resource从public/themes/Bareren/templates加载另一个文件。 看起来像这样

 page = {}; page.Template = "Index"; this.$http.get('themes/Barren/templates/'+page.Template+'.html').then((response) => { console.log(response.body); }); 

但是,这个请求并没有给我public/themes/Barren/templates 。 它反而给了网站自己的index.html文件。 我怎么能解决这个问题?

app.use(express.static(path.join(__ dirname,'/ public')));

app.get('/',(req,res)=> {res.sendFile(path.join(__ dirname,'index.html'));});

app.get('*',(req,res)=> {res.sendFile(path.join(__ dirname,'index.html'));});

尝试console.log(path.join(__ dirname,'/ public'))和console.log(path.join(__ dirname,'index.html')来查看path是否符合您的期望。

这个。$ http.get('themes / Barren / templates /'+ page.Template +'。html')。然后((response)=> {console.log(response.body);});

您也可以尝试控制台logging您的获取请求。 通常我需要玩弄path,以确保我正在提供正确的文件。

您可以尝试的一件事就是定义一个GET路由,在底部的通配符之前使用您的模板进行响应。

 app.get('/themes', (req, res) => { // get the theme name res.sendFile(path.join(__dirname, ... )); }); app.get('*', (req, res) => { res.sendFile(path.join(__dirname, 'index.html')); });