003 thinkphp6电商网站项目实战 -静态资源配置 首页配置

【qiaoguo 叨叨话】

在上一章节中，我已经实现了输入网站首页能够展示首页内容给用户看，在这个章节中，我将会记录如何把我们的模板文件配置到我们的网站上面来。

1.替换原来的首页文件

左图是我从网上随便找来的电商网站模板，现在把项目目录中的index,html删掉。
将左图中的index.html文件复制到index文件夹里面。

预览效果如下：

原因：现在引入的只是我们首页的html代码，而css样式以及js文件等资源都没有引入。

解决方法:更改资源路径地址

2.移动静态资源文件

在tp6中，在public目录下的staic文件夹是用来存放我们网站的静态资源，如图片、样式文件、css文件等等。

接下来，我把我们网站的assets文件夹复制到static文件夹目录下。

3.更改链接地址

现在资源目录存放好了，接下来要思考的是如何引入我们的静态资源文件。

回到view 目录下的index,html文件中，在css、img、js引入路径的前面加上’/static/'字符串，‘/’代表的是根目录，会定位到public目录下，‘static’代表static文件夹。

这里，我采用的方法是使用phpstorm工具，按下快捷键ctrl+R,弹出替换对话框，然后一键替换。

扩展

如果我们不想我们的static路径直接暴露，我们可以在tp6中使用一些字符串替换我们的/static/字符串，步骤如下

打开config文件夹下的view.php,在最后一行中添加如下代码

    //资源目录
    'tpl_replace_string'=>[
        '{_STATIC_PATH}'=>'/static/'
    ]

那么，我们就可以使用 {_STATIC_PATH} 代替我们 /static/ 了。

例子

原路径
  <link rel="stylesheet" href="assets/css/style.css">

现路径
  <link rel="stylesheet" href=" {_STATIC_PATH} assets/css/style.css">

最终效果如下

…
省略n张图片…

下一章，轮到捣一捣数据库咯~