ThinkPhp下把前端文件独立出来

前端独立之前的目录

thinkphp默认的View模板文件都是在/Application各个模块下的，css、js之类的资源文件是放在/Public目录下，大致是这个样子的：

ThinkphpSample
├─Application 项目逻辑目录
│  ├─Common 公共模块
│  │  ├─...
│  ├─Home  Home模块
│  │  ├─Controller  Home控制器目录
│  │  ├─...
│  │  ├─View  Home模块下的视图目录
│  │  │  ├─Index
│  │  │  │  ├─index.html
│  │  │  │  ├─...
│  ├─Admin  Admin模块
│  │  ├─Controller  Admin控制器目录
│  │  ├─...
│  │  ├─View  Admin模块下的视图目录
│  │  │  ├─Index
│  │  │  │  ├─index.html
│  │  │  │  ├─...
│  │  │  ├─Article
│  │  │  │  ├─index.html
│  │  │  │  ├─add.html
│  │  │  │  ├─edit.html
│  │  │  │  ├─...
│  ├─...
├─Public 资源文件目录
│  ├─Weixin  微信前端静态资源目录   
│  │  ├─js  home下调用的js文件目录
│  │  ├─css  home下调用的css文件目录
│  │  ├─images  home下调用的图片文件目录 
│  ├─Admin  管理后台静态资源目录   
│  │  ├─js  home下调用的js文件目录
│  │  ├─css  home下调用的css文件目录
│  │  ├─images  home下调用的图片文件目录 
│  ├─...
├─ThinkPHP 框架系统目录

但在实际开发中,这样把前端文件分散到各个模块下是有很多弊端的：

• 使用gulp这类前端工具很不便利；
  如果想要在src目录下全是原始代码，在dest目录下全是压缩后的html、js、css等，这是难以实现的。

前端独立之后的目录

把所有的模板文件和js、css等独立出来放在根目录下的/tpl中的；
如下：

ThinkphpSample
├─Application 项目逻辑目录
│  ├─Common 公共模块
│  │  ├─Common  公共函数目录
│  │  │  ├─functioin.php 公共函数php文件
│  │  ├─Conf  公共配置文件目录
│  │  │  ├─config.php  tp的配置 用于覆盖框架默认配置项
│  │  │  ├─db.php  数据库配置 用户名 密码等
│  │  │  ├─webconfig.php  项目的配置；网站名；是否开启网站等
│  │  ├─Controller  公共控制器目录 
│  │  │  ├─BaseController.class.php 应用最基础的控制器
│  │  │  ├─HomeBaseController.class.php  Home基础控制器继承BaseController
│  │  │  ├─AdminBaseController.class.php  Admin基础控制器继承BaseController
│  │  │  ├─UserBaseController.class.php  User基础控制器继承BaseController
│  │  │  ├─...
│  │  ├─Model  公共模型目录
│  │  │  ├─BaseModel.class.php  应用最基础的Model
│  │  │  ├─ArticleModel.class.php 文章model  继承BaseModel
│  │  │  ├─UserModel.class.php  用户model 继承BaseModel
│  │  │  ├─...
│  ├─Home  Home模块
│  │  ├─Controller  Home控制器目录 继承HomeBaseController
│  │  │  ├─ArticleController.class.php 文章控制器目录  
│  │  │  ├─IndexController.class.php  首页控制器
│  │  │  ├─ ...  
│  ├─Admin  Admin模块
│  │  ├─Controller  Admin控制器目录 继承AdminBaseController
│  │  │  ├─IndexController.class.php  后台管理首页控制器
│  │  │  ├─ ...  
│  ├─User  User模块
│  │  ├─Controller  User控制器目录 继承UserBaseController
│  │  │  ├─IndexController.class.php  用户个人中心首页控制器
│  │  │  ├─ ...  
├─Public 资源文件目录
│  ├─static       静态资源目录
│  │  ├─js        jquery等第三方js存放的目录
│  │  ├─css       animate.css等第三方css目录
│  │  ├─ ...  
│  ├─weixin       静态资源目录
│  │  ├─js        jquery等第三方js存放的目录
│  │  ├─css       animate.css等第三方css目录
│  │  ├─ ...          
├─tpl 视图文件生产目录
│  ├─Public  公共目录
│  │  ├─js  公共js目录
│  │  │  ├─base.js 全站都引用的js文件
│  │  │  ├─ ...  
│  │  ├─css  公共css目录
│  │  │  ├─base.css 全站都引用的css文件  
│  │  │  ├─ ...  
│  │  ├─images 公共图片目录 
│  │  ├─...  
│  ├─Home  前台Home视图目录   
│  │  ├─Index  首页文件目录
│  │  │  ├─index.html 首页  
│  │  │  ├─ ...
│  ├─Admin  同Home
│  ├─User   同Home
├─tpl_src  视图文件源目录
│  ├─Public  公共目录
│  │  ├─js  公共js目录
│  │  │  ├─base.js 全站都引用的js文件
│  │  │  ├─ ...  
│  │  ├─css  公共css目录
│  │  │  ├─base.css 全站都引用的css文件  
│  │  │  ├─ ...  
│  │  ├─images 公共图片目录 
│  │  ├─...  
│  ├─Home  前台Home视图目录   
│  │  ├─Index  首页文件目录
│  │  │  ├─index.html 首页  
│  │  │  ├─ ...
│  ├─Admin  同Home
│  ├─User   同Home
├─Runtime 缓存目录
├─ThinkPHP 框架系统目录

如何做到？

1. 在根目录的入口文件index.php文件中定义TMPL_PATH
   新增define("TMPL_PATH","./tpl/");

<?php
// 应用入口文件
// 检测PHP环境
if(version_compare(PHP_VERSION,'5.3.0','<'))  die('require PHP > 5.3.0 !');
// 开启调试模式 建议开发阶段开启 部署阶段注释或者设为false
define('APP_DEBUG',True);
// 定义应用目录
define('APP_PATH','./Application/');
// 定义模板文件默认目录
define("TMPL_PATH","./tpl/");
// 引入ThinkPHP入口文件
require './ThinkPHP/ThinkPHP.php';

2. 在/Application/Common/Conf/config.php文件中定义静态资源目录

<?php
return array(
    'TMPL_PARSE_STRING'=>array(
        '/Public'=>.trim(TMPL_PATH,'.').'/Public/Static'
    )
);