前端代码风格统一规范(项目依赖版)
目标及介绍
利用项目集成插件的方式来实现
使用项目插件的方式集成到项目中
确保多人协作或者同一团队产出的代码规范统一，看上去像出自一人（很理想化，哈哈）
目前的主流方式：eslint+commitlint+prettier+editorConfig
eslint
js/ts规范检查工具
commitlint
规范 commit msg，配合
husky一起使用，配合lint-staged则更加完美husky：githooks 工具，在 Git 提交前搞一些事情lint-staged：只检查 staged 文件（也就是被 git add 的文件），提高执行效率
prettier
代码格式化工具
editorConfig
帮助维护跨多个编辑器和 IDE 的同一个项目的多个开发人员的一致编码风格
需要安装EditorConfig for VS Code插件以确保项目中的 .editorConfig 配置能正常读取
向头部大厂的前端开发攻城狮看齐
使用企业微信扫码登录美化二维码
这是在开发公司 sso jssdk 时遇到的问题，登录方式增加了企业微信扫码登录，但是企业微信扫码的二维码我希望能美化下，文档说明如下,
参数说明
| 参数 | 必须 | 说明 |
|---|---|---|
| … | … | … |
| href | 否 | 自定义样式链接，企业可根据实际需求覆盖默认样式 |
可以提供相关 css 样式文件，并把链接地址填入 href 字段（只支持 https 协议的资源地址）：
⚠️⚠️ 但是这不是我想要的啊 ⚠️⚠️
- 需要提供 https 提供的 css 链接
- 还要设置 CORS 头，避免跨域问题
- css 万一修改的话感觉也很烦（虽然一般不会修改 😝）
在网上发现了新的方法在此记录下，我觉的很赞
通过访问 data-url 解决样式问题
npm和yarn命令对比
一、命令对比
| yarn | npm | 命令功能 |
|---|---|---|
| yarn install | npm install | 根据 pack.json 安装项目所需的依赖包 |
| yarn install –flat | – | 注释 1 |
| yarn install –no-lockfile | npm install –no-package-lock | 不读取或生成 yarn.lock 锁文件 |
| yarn install –pure-lockfile | – | 不要生成 yarn.lock 锁文件 |
| yarn add [package] | npm install [package] | 安装需要的依赖包 |
| yarn add [package] –dev | npm install [package] –save-dev | 注释 2 |
| yarn add [package] –D | npm install [package] –save-dev | 同上 |
| yarn add [package] –peer | – | 注释 3 |
| yarn add [package] –P | – | 同上 |
| yarn add [package] –optional | npm install [package] –save-optional | 注释 4 |
| yarn add [package] –O | npm install [package] –save-optional | 同上 |
| yarn add [package] –exact | npm install [package] –save-exact | 注释 5 |
| yarn add [package] –E | npm install [package] –save-exact | 同上 |
| yarn global add [package] | npm install [package] –global | 全局安装依赖包 |
| yarn global upgrade | npm update –global | 全局更新依赖包 |
| yarn add –force | npm rebuild | 更改包内容后进行重建 |
| yarn remove [package] | npm uninstall [package] | 卸载已经安装的依赖包 |
| yarn cache clean [package] | npm cache clean | 注释 6 |
| yarn upgrade | rm -rf node_modules && npm install | 更新依赖包 |
| yarn version –major | npm version major | 更新依赖包的版本 |
| yarn version –minor | npm version minor | 更新依赖包的版本 |
| yarn version –patch | npm version patch | 更新依赖包的版本 |
二、命令注释
vue 报错-- xxx is not a valid attribute name
问题
最近在做项目的时候发现一个神奇的 bug，点击某一个 Radio 的时候提示下面 👇 报错，其他都 OK
1 | Error in nextTick: "InvalidCharacterError: Failed to execute 'setAttribute' on 'Element': '`' is not a valid attribute name." |
用 Vue 以来从来没遇到过
解决
后来一步步检查，从 js 传参，赋值开始，一个个检查过去没有问题…
然后检查 html 发现了最低级的错误..
好尴尬，不知道在什么时候在placeholder中间多敲了一个∂ 就成了plac∂eholder 。
删除就好了