如何将JS/CSS文件包含到Slim Framework的模板中?

问题描述

我正在使用Slim框架开发一个简单的Web应用程序.我陷入了一个可能简单的问题.我想在模板中包含静态文件(CSS和Javascript).

I am developing a simple web app with Slim framework. I got stuck with a probably simple problem. I want to include static files (CSS and Javascript) into my template.

我的项目文件夹结构如下:

My project folder structure is as follows:

index.php //<=== where all the routing happens.
/flot
      layout.css
      jquery.js
      ....
/templates
      first_template.php

first_template.php的标头包含:

My header of first_template.php contains:

<link href="../flot/layout.css" rel="stylesheet" type="text/css">
<script language="javascript" type="text/javascript" src="../flot/jquery.js"></script>

当我调用项目的根URL

When I call the projects root url

http://localhost/xampp/ProjectX/

(我正在使用XAMPP)显示了模板，但是CSS和javascript内容无法正常工作. Google Chrome控制台显示:

(I'm using XAMPP) the template shows up, but the css and javascript stuff is not working. The Google Chrome console shows:

GET http://localhost/xampp/ProjectX/flot/layout.css 404 (Not Found)
GET http://localhost/xampp/ProjectX/flot/jquery.js 404 (Not Found)

有什么建议吗?我花了整整一个小时在谷歌搜索上，但是Slim框架的整体文档实际上还很薄:)

Any suggestions? I spent almonst one hour in googling, but the overall documentation of the Slim framework is still literally slim :)

推荐答案

我假定您正在项目根目录(index.php)上显示模板，因此应从样式表和JS相对路径中删除../:

I assume you are displaying your Template on the Project root (index.php), so you should remove the ../ from your Stylesheet and JS relative Paths:

<link href="flot/layout.css" rel="stylesheet" type="text/css">
<script language="javascript" type="text/javascript" src="flot/jquery.js"></script>

这篇关于如何将JS/CSS文件包含到Slim Framework的模板中?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！