7月
27
7月
16
随着苹果 8 以后的手机等出现，顶部，底部自适应问题是手机应用（app,web,小程序）要解决的问题。对于网页和小程序可以使用 env(safe-area-inset-bottom) 等解决。
env()和constant()，是IOS11新增特性，Webkit的css函数，用于设定安全区域与边界的距离，有4个预定义变量：
- safe-area-inset-left：安全区域距离左边边界的距离
- safe-area-inset-right：安全区域距离右边边界的距离
- safe-area-inset-top：安全区域距离顶部边界的距离
- safe-area-inset-bottom ：安全距离底部边界的距离
而env()和constant()函数有个必要的使用前提，H5网页设置viewport-fit=cover的时候才生效，小程序里的viewport-fit默认是cover。
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
适配底部代码：
height: calc(96rpx+ constant(safe-area-inset-bottom));//兼容 IOS<11.2
height: calc(96rpx + env(safe-area-inset-bottom));//兼容 IOS>11.2
padding-bottom: constant(safe-area-inset-bottom);//兼容 IOS<11.2
padding-bottom: env(safe-area-inset-bottom);//兼容 IOS>11.2
// 先constant再env
文章来源第二个有说到兼容性问题。
文章来源
https://www.cnblogs.com/djjlovedjj/p/13983852.html
https://www.cnblogs.com/djjlovedjj/p/14686684.html
7月
02
console.log(0.1+0.2);
# 输出 0.30000000000000004
对于 js 浮点数计算不正确问题，请参考下边：
https://www.cnblogs.com/xinggood/p/6639022.html
1月
28
app 通常会有启动页，引导页和闪屏这三个前奏页面。启动页必须有，不可跳过。引导页通常是第一次启动有和更新版本后有。闪屏可能有广告的嫌疑，用户可点击跳过，也可以等待倒计时跳过。
像 soul 就是强制有 启动页和闪屏。不过闪屏都是一些比较漂亮的图片。
启动页 splash
引导页 guid
闪屏 flash
launchFlag
12月
28
vue cli 配置 dev 的 host 和端口号
# vue.config.js 中
module.exports = {
devServer: {
port: 80, // 端口号，如果端口号被占用，会自动加1
host: "sky.cn", //主机名， 127.0.0.1， 真机 0.0.0.0
https: false, //协议
open: true //启动服务时自动打开浏览器访问
},
可是当： npm run dev 的时候，端口号却是 1024。 话说 mac 下启动 1024 以下的端口需要 root 权限。用 sudo 试试。
sudo npm run dev
当然，仅仅上边是不可以的。我们要修改 host，映射一下。
# mac 下
sudo vim /etc/hosts
# 增加
127.0.0.1 sky.cn
# windows 下
win + r -> drivers -> cd etc -> vim hosts
# 增加
127.0.0.1 sky.cn
这样，service 结果
App running at:
- Local: http://sky.cn:80/
- Network: http://sky.cn:80/
Note that the development build is not optimized.
To create a production build, run npm run build.
优化
这个配置硬写在 vue.config.js 中。这样不好看。我们写在环境配置中。在 .env.development 中，新增配置：
# 配置 service 的域名
VUE_APP_HOST = 'sky.cn'
# 配置 service 的端口号
VUE_APP_PORT = '80'
然后，在 vue.config.js 中这样修改：
const host = process.env.host || process.env.VUE_APP_HOST || '127.0.0.1'
const port = process.env.port || process.env.VUE_APP_PORT || process.env.npm_config_port || 80
module.exports = {
devServer: {
host: host, //主机名， 127.0.0.1， 真机 0.0.0.0
port: port, // 端口号，如果端口号被占用，会自动加1
https: false, //协议
open: true, //启动服务时自动打开浏览器访问
overlay: {
warnings: false,
errors: true
},
before: ''
},
…
环境变量一说可以参考这里：https://cli.vuejs.org/zh/guide/mode-and-env.html#%E6%A8%A1%E5%BC%8F
12月
08
项目中，配置文件的作用是想当美丽的。这样使代码看起来好看，用起来还方便。不至于因为某个条件或场景还跑到逻辑里去修改。vue cli 里边就可以自己定义 .env.production .env.development .env
https://cli.vuejs.org/zh/guide/mode-and-env.html
有下边的概念：
- 通过 process.env.xxx 来取。
- 对象命名以 VUE_APP_ 开头。 如 VUE_APP_API
- .env.production 和 .env.development 会覆盖 .env 中定义的。
如果不生效，配置不生效，可能是定义对象的时候没以 VUE_APP_ 开头
这里列举几个定义：
# just a flag
ENV = 'production'
# base api
VUE_APP_BASE_API = 'http://117.24.6.252:8002'
# mode
VUE_APP_MODE = 'history'
12月
05
知识点方方面面。有时候不能全部都 get 到。碰到一个是一个。
这样就这样
- src/assets 文件夹和 src/static 文件夹。
assets 和 static 两个都是存放静态资源文件。项目中所需要的资源文件图片，字体图标，样式文件等都可以放在这两个文件下，这是相同点
assets中存放的静态资源文件在项目打包时，也就是运行npm run build时会将assets中放置的静态资源文件进行打包上传，所谓打包简单点可以理解为压缩体积，代码格式化。而压缩后的静态资源文件最终也都会放置在static文件中跟着index.html一同上传至服务器
static中放置的静态资源文件就不会要走打包压缩格式化等流程，而是直接进入打包好的目录，直接上传至服务器。因为避免了压缩直接进行上传，在打包时会提高一定的效率，但是static中的资源文件由于没有进行压缩等操作，所以文件的体积也就相对于assets中打包后的文件提交较大点。在服务器中就会占据更大的空间。
让 html 的title 动态的变换。就这样用吧。请看清看。
https://blog.csdn.net/weixin_43972992/article/details/102657462
