Sharing the thinkphp Template engine import resource file scheme

This article mainly introduces the thinkphp template engine import resource file method, the need for friends can refer to the following

In general, the traditional way of Web page import external JS and CSS resource file method is directly in the template file use:

<script type= ' text/javascript ' src= '/public/js/util/array.js ' ><link rel= "stylesheet" type= "Text/css" href= "/app/tpl/default/public/css/style.css"/>

The thinkphp template engine provides a special label to simplify the above import.

1.import Label

The first is the import label, which uses the namespace-like method of an import function similar to thinkphp, for example:

<import type= ' js ' file= "Js.Util.Array"/>

The type attribute is JS by default, so the following effect is the same:

<import file= "Js.Util.Array"/>

You can also support batch import of multiple files, for example:

<import file= "Js.util.array,js.util.date"/>

Importing an external CSS file must specify the value of the Type property, for example:

<import type= ' css ' file= "Css.common"/>

The default import path above is the public directory under the root of the Web site, and if you need to specify a different directory , you can use the BasePath property, for example:

<import file= "Js.Util.Array" basepath= "./common"/>

If the imported file contains a "." Number, you can use:

<import file= "Js.util.array#min"/>

Represents the import of a/public/js/util/array.min.js resource file.

The version number of the resource file is also supported for import, for example:

<import type= ' js ' file= "js.util.array?v=120"/>

When importing multiple files, you can also support

<import type= ' js ' file= "js.util.array?125,js.util.date?130"/>

The Improt tag supports judging the load , for example the following first determines whether the name variable is set:

<import type= ' js ' file= "Js.Util.Array" value= "name"/>

Or even more complex, you can take a function :

<import type= ' js ' file= "Js.Util.Array" value= "Think.get.name|isset"/>

The compiled template cache is:

<?phpif (isset ($_get[' name ')):? ><script type= "Text/javascript" src= "/public/js/util/array.js" ></ Script><?phpendif;? >

2.load Label

The second one is the load tag, which imports the public JS or CSS of the current project via URL, for example:

<load href= "/public/js/common.js"/><load href= "/public/js/date.js?v=235"/><load href= "/Public/Css/ Common.css "/>

The href attribute can be replaced with a special template label, for example:

<load href= "!-public-!/js/common.js"/>

The load tag does not have to specify the type attribute and the system automatically determines it automatically based on the suffix.
Of course, the load tag also supports conditional judgment calls:

<load href= "/public/js/common.js" value= "name"/>

The system also provides two tag aliases for JS and CSS usage and load consistency , for example:

<js href= "/public/js/common.js"/><css href= "/public/css/common.css"/>

the load tag also supports importing multiple resource files, even different types of resource files, at the same time :

<load href= "/public/js/common.js,/public/css/common.css"/>

The above is the whole content of this article, I hope that everyone's learning has helped, more relevant content please pay attention to topic.alibabacloud.com!