整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

Rust 小技巧指定 target 输出目录

Rust 编程语言中,target 目录是由 Cargo(Rust 的包管理和构建工具)自动生成的。它主要用于存放构建输出的产物文件相关的编译期产生的中间文件等。但是 target 目录往往会非常大,即使一个简单的 hello world 程序,就已经达到 9 MB 了。

可能一个比较简单的项目,会达到 1 GB 多。甚至有些网友调侃——如果电脑硬盘太小,可能学不了 Rust。

0x01 指定 target 目录

另外当电脑中的 Rust 项目太多时,无法管理 target 目录。其实我们可以指定所有项目统一的 target 目录。下面将以 Windows 操作系统为例演示。

首先在 C:\Users\用户名\.cargo\ 目录下,找到 config.toml 文件。如果在该目录下没有 config.toml 文件,则需要创建该文件。如下图所示:

注意:config 文件也有可能没有扩展名,如 config,又或者是其它扩展名,如 config.txt,配置文件的扩展名不重要,重要的是文件名称必须是 config

在文件中添加下面的配置信息:

 [build]
target-dir = "D:/my-target"

上面的配置是指定所有项目的统一 target 目录为 D:/my-target。如下图:

我们再次编译项目,查看项目根目录和 D:/my-target 目录,如下图:

可以看到,在项目的工程目录已经没有 target 目录,真正的 target 目录已经被我们指定为 D:/my-target 目录了。

0x02 target 目录有什么

下面是一个简单项目的 target 目录,让我们看下它会包含什么呢?

target 目录包含以下几个子目录和文件:

target/debug:

  • 存储调试模式下构建的可执行文件和库文件。
  • 包含中间编译产物,如对象文件(.o 文件)和生成的二进制文件。

target/release:

  • 存储发布模式下构建的可执行文件和库文件。
  • 与调试模式相比,发布模式进行了优化,生成的二进制文件通常更小且运行速度更快。

target/doc:

  • 存放项目文档(通常是通过 cargo doc 命令生成的 HTML 文档)。

target/.fingerprint:

  • 存储构建的指纹文件,用于跟踪哪些文件已经被编译以及是否需要重新编译。

target/package:

  • 存放项目打包后的文件,通常用于 cargo publish 命令发布到 crates.io 仓库。

其他临时文件和目录:

  • 包括构建缓存、生成的汇编代码等。

0x03 指定 target 目录的优缺点

统一存放 target 文件既有优点也有缺点:

优点

缓存复用

如果多个项目使用相同的依赖库,通过指定一个共享的 target 目录,可以复用编译缓存,减少重复编译的时间,大幅提升构建效率。

管理方便

通过将编译输出集中到一个特定目录,可以更方便地管理和清理编译输出文件。当 Rust 项目过多时,我们可以随时清理 target 文件。

缺点

多个项目共享同一个 target 目录可能会因为不同的依赖版本而产生冲突,当遇到冲突时需要及时清理 target 目录。

0x04 小结

总体上讲,指定 target 目录可以带来显著的构建效率提升,但也需要考虑潜在的版本冲突问题,这个需要根据实际的项目来取舍。


lt;h2 id="title1">开发工具(工欲善其事必先利其器)</h2>

  • 为了让大家更快的融入到编程的世界中, 不被繁琐的英语单词所困扰, 不用每天编写很多没有意义的重复代码, 提升大家的开发效率今后的课程中我们统一采用最高级高发工具来编写网页

<h3 id="title2">常见的前端开发工具</h3>

  • 记事本: 提示功能较差

  • editplus/nodepad++: 提示功能较差

  • Dreamwaver: 更偏向设计

  • Sublime: 轻量级,自带功能不太全, 但是插件十分丰富

  • WebStorm: 重量级, 自带功能全面

  • 其它ide(zend studio、netbean等)

  • 为了让大家更快的融入到编程的世界中, 不被繁琐的英语单词所困扰, 今后的课程中我们统一采用最牛逼最高级的高发工具WebStorm

<h3 id="title3">WebStorm安装和使用</h3>

  • 安装软件

1.png

2.png

3.png

4.jpg

5.jpg

6.png

7.jpg

8.png

  • 破解软件

9.png

10.png

11.jpg

12.jpg

13.png

14.png

  • 汉化软件

15.png

16.jpg

  • 设置模版

  • 创建文件

17.png

18.jpg

关注微信订阅号:网页设计轻松学 有更多内容

19.png

  • WebStorm常见快捷键

  • 如何在WebStorm中利用快捷键创建一个新的.html的文件

    • 同时按下键盘上的Ctrl + Alt + Insert

  • 如何在WebStorm中让光标移动到当前行的末尾

    • 按下键盘上的End键即可

  • 如何在WebStorm中让光标移动到当前行的最前面

    • 按下键盘上的Home键即可

  • 如何在WebStorm中让光标在多行中闪烁

    • 按住键盘上的Alt键不放, 然后再按住鼠标的左键不放, 然后再拖动鼠标即可

  • 如何在WebStorm中快速的复制光标所在的那一行

    • 按下键盘上的Ctrl + D

  • 如何在WebStorm中快速的删除光标所在的那一行

    • 按下键盘上的Ctrl + X

  • 如何在WebStorm中让标签包裹一段内容, 也就是自动在一段内容前后加上标签

    • 按下键盘上的Ctrl + Alt + T, 然后按下回车, 然后输入对应的标签即可


<h2 id="title4">基础标签学习</h2>

<h3 id="title5">H系列标签(Header 1~Header 6)</h3>

  • 作用:

    • 用于给文本添加标题语义

  • 格式:

    • <h1>xxxxxx</h1>

  • 注意点:

    • H标签是用来给文本添加标题语义的, 而不是用来修改文本的样式的

    • H标签一共有6个, 从H1~H6, 最多就只能到6, 超过6则无效

    • 被H系列标签包裹的内容会独占一行

    • 在H系列的标签中, H1最大, H6最小

    • 在企业开发中, 一定要慎用H系列的标签, 特别是H1标签. 在企业开发中一般情况下一个界面中只能出现一个H1标签(和SEO有关)

<h3 id="title6">P标签(Paragraph)</h3>

  • 作用:

    • 告诉浏览器哪些文字是一个段落

  • 格式:

    • <p>xxxxxxxx</p>

  • 注意点:

    • 在浏览器中会单独占一行

<h3 id="title7">Hr标签(Horizontal Rule)</h3>

  • 作用:

    • 在浏览器上显示一条分割线

  • 格式:

    • <hr />

  • 注意点:

    • 在浏览器中会单独占一行

    • 通过我的观察发现HR标签可以写/也可以不写/, 如果不写/那么就是按照HTML的规范来编写, 如果写上/那么就是按照XHTML的规范来编写.但是在HTML5中, 由于HTML5兼容HTML和XHTML所有写不写都可以.那么以后我们在做前端开发时到底写还是不写呢? 按照高级开发工具的提示来写即可.

    • 由于hr标签是用来修改样式的, 所以不推荐使用. 今后开发中添加水平线一般都使用CSS盒子来做


<h2 id="title8">HTML注释(Annotation)</h2>

  • 什么是注释?

    • 注释是在所有计算机语言中都非常重要的一个概念,从字面上看,就是注解、解释的意思

    • 注释可以用来解释某一段程序或者某一行代码是什么意思,方便直接或程序员之间的交流

  • 为什么要使用注释?

    • 适当的注释,能够让我们的程序更加可读,所以用中文提示自己,这里的程序是干什么的

  • 注释格式

<!--被注释的内容-->
  • 注意点:

    • 被注释的内容不会在浏览器中显示, 注释是写给我们自己看的

    • 注释不能嵌套使用

<!--<!--被注释的内容-->-->
  • 快捷键: ctrl + /


<h3 id="title9">img标签(image)</h3>

  • 作用: 在网页上插入一张图片

  • 格式: ![](图片路径)

  • 标签的属性

    • 写在标签中K="V"这种格式的文本我们称之为标签属性

属性名称作用
src(source)告诉浏览器需要插入的图片路径, 以便于浏览器到该路径下找到需要插入的图片
alt(alternate)规定图像的替代文本, 只有在src指定的路径下找不到图片,才会显示alt指定的文本
title悬停文本(介绍这张图片, 只有在鼠标移动到图片上时才会显示)
height设置图片显示的高度
width设置图片显示的宽度
  • 注意点:

    • img标签添加的图片默认不是占一整行空间

    • 如果想让图片等比拉伸, 只写高度或者宽度即可

关注微信订阅号:网页设计轻松学 有更多内容

<h3 id="title10">br标签(Break)</h3>

  • 作用:

    • 让内容换行

  • 格式:

    • <br/>

  • 注意点:

    • br的意思是不另起一个段落进行换行, 而网页中99.99%需要换行时都是因为另起了一个段落, 所以应该用p来做

<h3 id="title11">相对路径和绝对路径</h3>

  • 图片路径分为两种, 一种是绝对路径, 一种是相对路径, 我们重点学习相对路径, 因为在企业级开发中没有人使用绝对路径

  • 绝对路径

    • 从电脑的具体盘符开始寻找我们需要的资源

    • ![](F:/lnj/girl.png)

    • 以上代码表示在F盘下查找lnj文件夹, 然后在lnj文件夹下查找girl.png图片

  • 相对路径

    • 一个文件相对于另外一个文件的位置寻找我们需要的资源

    • ![](girl.png)

    • 假设html文件和girl.png都在lnj文件夹下, 以上代码表示在lnj文件夹下查找girl.png图片

  • 为什么没人使用绝对路径?

    • 可以移植性太差.

  • 什么是可移植性?

    • 可以简单的理解为把写到的代码拷贝到另外一台电脑上是否能够正常运行

  • 为什么绝对路径可移植性差?

    • 假如我编写的html文件放在我电脑的 F:/lnj 目录下, html文件中用到的图片放在F:/lnj/images目录下, 我给src指定的绝对路为F:/lnj/images/girl.png. 那么将来我将整个lnj文件夹拷贝给你, 如果你将lnj文件夹放在非F盘下, 那么将无法显示图片

    • 例如你存放在C盘根目录, 那么图片的绝对路径会变为C:/lnj/images/girl.png, 而src会去F盘找, 所以不会显示

    • 你只有将lnj文件夹存放在F盘根目录下时图片才会正常运行, 这就叫做可移植性不好

    • Q群;162542073

  • 为什么相对路径可移植性好?

    • 同上, 如果src指定的路径为images/girl.png, 那么无论你拷贝到那个盘, 哪个文件夹. 系统都只会在当前文件夹中的images下去查找图片, 不会受到盘符和存储位置的影响, 只要保证页面和图片位置的相对关系不变就不会影响到图片的显示

  • 相对路径几种查找方式

    • ../代表访问上级目录

    • 假设a文件夹下面有b文件夹, 图片存放在a文件夹中, html文件存放在b文件夹中, 那么路径为../girl.png

    • 因为html文件在b文件夹中, 所以路径是相对于b文件夹的, 所以../代表访问b文件夹的上一级目录, b文件夹的上一级目录是a文件夹, 所以../girl.png就代表在a文件夹查找girl.png

    • 直接编写, 例如abc/girl.png

    • 加上./ 编写, 例如./abc/girl.png

    • 相对当前目录有几个文件夹,就在后面依次补全几个文件夹名称即可, 例如 abc/bbb/ccc/ddd/girl.png./abc/bbb/ccc/ddd/girl.png

    • 直接编写, 例如: girl.png

    • 加上./ 编写, 例如./girl.png

    • ./代表当前目录, ./girl.png代表在当前目录下查找

    • 同级

    • 下级

    • 上级

  • 注意事项:

    • 相对路径不会出现这种格式aaa/../bbb/girl.png

    • 虽然可以显示, 但是企业开发中千万不要这么写

<h3 id="title12">a标签(anchor)</h3>

  • 格式: <a href="http://www.it666.com">江哥博客</a>

  • 作用: 用于从一个页面链接到另一个页面

  • 注意事项:

    • 在a标签之间一定要写上文字, 如果没有, 那么在页面上找不到这个标签

    • a标签也叫做超级链接超链接

  • a标签的属性

属性名称作用
href(hypertext reference)指定跳转的目标地址
target告诉浏览器是否保留原始界面, _blank保留, _self不保留
title悬停文本(介绍这个链接, 只有在鼠标移动到超链接上时才会显示)
  • base标签和a标签结合使用

    • 如果每个a标签都想在新页面中打开,那么逐个设置a标签的target属性比较麻烦, 这时我们可以使用base和a标签结合的方式,一次性设置有a标签都在新页面中打开

    • 格式: <base target="_blank" />

  • 注意事项:

    • base必须嵌套在head标签里面

    • 如果标签上指定了target,base中也指定了target,那么会按照标签上指定的来执行

  • a标签其它用法

    • 例如<a href="girl.zip">下载福利资源<a/>

    • 格式: <a href="01-锚点链接.html#location">跳转到指定位置</a>

    • 只需要在01-锚点链接.html页面添加一个id位置即可

    • 2.1.格式<a href="#location">跳转到指定位置</a>

    • 2.2.在页面的指定位置给任意标签添加一个id属性

    • 例如 <p id="location">这个是目标</p>

    • 格式<a href="#">江哥博客</a>

    • 格式<a href="javascript:">江哥博客</a>

    • 假链接(本质是跳转到当前页面)

    • 跳转到当前页面指定位置(锚点链接)

    • 跳转到指定页面的指定位置

    • 下载(极力不推荐使用)

、常用html标签

4.1 常用的 html 标签

<!-- 1、成对出现的标签:-->

<h1>h1标题</h1>
<div>这是一个div标签</div>
<p>这个一个段落标签</p>


<!-- 2、单个出现的标签:-->
<br>
<img src="images/pic.jpg" alt="图片">
<hr>

<!-- 3、带属性的标签,如src、alt 和 href等都是属性 -->
<img src="images/pic.jpg" alt="图片">
<a href="http://www.baidu.com">百度网</a>

<!-- 4、标签的嵌套 -->
<div>
   <img src="images/pic.jpg" alt="图片">
   <a href="http://www.baidu.com">百度网</a>
</div>

提示:

  1. 标签不区分大小写,但是推荐使用小写。
  2. 根据标签的书写形式,标签分为双标签(闭合标签)和单标签(空标签)2.1 双标签是指由开始标签和结束标签组成的一对标签,这种标签允许嵌套和承载内容,比如: div标签2.2 单标签是一个标签组成,没有标签内容, 比如: img标签

4.2 小结

  • 学习 html 语言就是学习标签的用法,常用的标签有20多个。
  • 编写 html 标签建议使用小写
  • 根据书写形式,html 标签分为双标签和单标签
  • 单标签没有标签内容,双标签可以嵌套其它标签和承载文本内容

五、资源路径

当我们使用img标签显示图片的时候,需要指定图片的资源路径,比如:

<img src="images/logo.png">

这里的src属性就是设置图片的资源路径的,资源路径可以分为相对路径和绝对路径

5.1 相对路径

从当前操作 html 的文档所在目录算起的路径叫做相对路径

示例代码:

<!-- 相对路径方式1 -->
<img src="./images/logo.png">
<!-- 相对路径方式2 -->
<img src="images/logo.png">

5.2 绝对路径

从根目录算起的路径叫做绝对路径,Windows 的根目录是指定的盘符,mac OS 和Linux 是/

示例代码:

<!-- 绝对路径 -->
<img src="/Users/apple/Desktop/demo/hello/images/logo.png">
<img src="C:\demo\images\001.jpg">

提示:

一般都会使用相对路径,绝对路径的操作在其它电脑上打开会有可能出现资源文件找不到的问题

5.3 小结

  • 相对路径和绝对路径是 html 标签使用资源文件的两种方式,一般使用相对路径。
  • 相对路径是从当前操作的 html 文档所在目录算起的路径
  • 绝对 路径是从根目录算起的路径

六、列表标签

6.1 列表标签的种类

  • 无序列表标签(ul标签)
  • 有序列表标签(ol标签)

6.2 无序列表

<!-- ul标签定义无序列表 -->
<ul>
   <!-- li标签定义列表项目 -->
   <li>列表标题一</li>
   <li>列表标题二</li>
   <li>列表标题三</li>
</ul>

6.3 有序列表

<!-- ol标签定义有序列表 -->
<ol>
   <!-- li标签定义列表项目 -->
   <li><a href="#">列表标题一</a></li>
   <li><a href="#">列表标题二</a></li>
   <li><a href="#">列表标题三</a></li>
</ol>

6.4 小结

  • 列表标签有无序列表标签(ul标签)和有序列表标签(ol标签)
  • 列表项目对顺序有要求的时候使用ol标签
  • 列表项目对顺序无要求的时候使用ul标签

七、表格标签

7.1 表格的结构

表格是由行和列组成,好比一个excel文件

7.2 表格标签

<table>标签:表示一个表格
     <tr>标签:表示表格中的一行
         <td>标签:表示表格中的列
         <th>标签:表示表格中的表头

示例代码:

<table>
   <tr>
       <th>姓名</th>
       <th>年龄</th>
   </tr>
   <tr>
       <td>张三</td>
       <td>18</td>
   </tr>
</table>

表格边线合并:

border-collapse 设置表格的边线合并,如:border-collapse:collapse;