I'm building an Multi-Page Application at the moment with Express & Angular. I've set up my folder structure like this:
我正在使用Express&Angular构建一个多页面应用程序。我已经设置了这样的文件夹结构:
project
|- server.js (The webserver)
|- routes.js (The routes to serve the html pages)
| |- node_modules
| |- config
| |- controllers (The routes for the API)
| |- models (The SQL models - Sequelizer
| |- client
| |- client.js (AngularJS main module)
| |- pages (Splitting the pages into Angular SPA)
| |- pageFolder (One for each page)
| |- page.html (The template for this SPA)
| |- page.js (The AngularJS controller)
| |- views (The views for the page)
I've done extensive research and this seemed like a very comfortable way to structure everything. The API section of my code works like a charm as does the AngularJS modules on the client-side. I'm struggling with linking the two.
我做了大量的研究,这似乎是一种非常舒适的方法来构建一切。我的代码的API部分就像魅力一样,客户端的AngularJS模块也是如此。我正在努力将两者联系起来。
In my routes.js
file, I serve the index files for the particular page that has been requested - for example:
在我的routes.js文件中,我提供了已请求的特定页面的索引文件 - 例如:
var express = require("express");
var router = express.Router();
router.get("/", function(request, response){
response.sendFile("home.html",{
root: "client/pages/home"
});
});
router.get("/otherPage", function(request, response){
response.sendFile("otherPage.html",{
root: "client/pages/otherPage"
});
});
module.exports = router;
This was working perfectly file until I started trying to integrate the AngularJS modules into the pages. I have set up a /resources
static route to the node_modules
folder, which lets me include AngularJS and other libraries in each of the pages. The AngularJS Controllers, however, are placed in each of the page folders rather than in a centralized folder controllers
and when I try include a controller like this for example:
这是完美的文件,直到我开始尝试将AngularJS模块集成到页面中。我已经设置了一个/ resources静态路由到node_modules文件夹,这让我可以在每个页面中包含AngularJS和其他库。但是,AngularJS控制器放在每个页面文件夹中,而不是放在集中式文件夹控制器中,当我尝试包含这样的控制器时,例如:
<script src="home.js"></script>
The server is handling the request as http://website.com/home.js
which I can understand but I'm not sure how to allow the pages to include files within their folder?
服务器正在处理请求http://website.com/home.js,我可以理解,但我不知道如何允许页面包含其文件夹中的文件?
Any suggestions would be appreciated :)
任何建议,将不胜感激 :)
1 个解决方案
#1
1
Can you try this:
你能试试这个:
app.use(express.static('folder1'));
app.use('/folder2', express.static('folder2'));
router.get("/otherPage", function(request, response){
response.sendFile(__dirname + "/otherPage.html");
});
This way, website.com/folder2 will serve files from folder2 and you can just obtain them by website.com/folder2/file and when you go to website.com/otherPage, it will give you the /otherPage.html and stuff like that.
这样,website.com/folder2将提供来自folder2的文件,您可以通过website.com/folder2/file获取它们,当您访问website.com/otherPage时,它会为您提供/otherPage.html等内容那。
#1
1
Can you try this:
你能试试这个:
app.use(express.static('folder1'));
app.use('/folder2', express.static('folder2'));
router.get("/otherPage", function(request, response){
response.sendFile(__dirname + "/otherPage.html");
});
This way, website.com/folder2 will serve files from folder2 and you can just obtain them by website.com/folder2/file and when you go to website.com/otherPage, it will give you the /otherPage.html and stuff like that.
这样,website.com/folder2将提供来自folder2的文件,您可以通过website.com/folder2/file获取它们,当您访问website.com/otherPage时,它会为您提供/otherPage.html等内容那。