前期的所有
1、favicon
vue中为网页增加favicon的最便捷的方式为使用link
标签
<link rel="shortcut icon" type="image/x-icon" href="./static/favicon.ico" rel="external nofollow" />
从href
属性我们可以知道,这个favicon.ico文件被放在static文件夹下。那可以不可以像平时的网页可以放在根目录下呢?本人测试为false。使用vue-cli构建vue项目的最后一步为build
,build后得到一个dist文件夹,目录如下:
dist
├── index.html
└── static
├── css
│ ├── app.98d86b95fddce7c6712349c91fd3ac42.css
│ └── app.98d86b95fddce7c6712349c91fd3ac42.css.map
├── favicon.ico
├── img
│ └── icon.b36fe83.png
└── js
├── app.8fece2e344934ca56814.js
├── app.8fece2e344934ca56814.js.map
├── manifest.1f0d87f2abce4b6b3d40.js
├── manifest.1f0d87f2abce4b6b3d40.js.map
├── vendor.6e85d686677580e84eb8.js
└── vendor.6e85d686677580e84eb8.js.map
当将这个文件放在根目录下的时候,build出来的项目里不会含有favicon.ico文件。
从static的字面意思来讲,静态的,除了文件的静态性,还包含有文件路径的静态性。build前后index.html都有同级目录的static文件夹,因此build前后引用的路径不会发生改变。个人猜测跟webpack的打包方式有关,它会去拷贝一个static文件夹,然后在往里面添加打包后的文件。
二级标题
三级标题
四级标题
注: