vite.config.js
postcss.config.js
注意 main.js 引入 lib-flexible
src/router/index.js
main.js
app.vue
src/store/common.js
main.js
src/utils/http.js
src/servers/common.js
vite.config.js
// vscode 路径提示
jsconfig.json
下载
main.js
.eslintrc.js 修改
常用命令
检测文件
npx eslint “src/App.vue”
npx eslint --ext .js,vue src
npx eslint “src*.{js,vue}”
格式化文件
npx eslint “src*.{js,vue}” --fix
添加 .eslintignore
如果您使用 ESLint,请安装 eslint-config-prettier 以使 ESLint 和 Prettier 彼此配合得很好。它会关闭所有不必要的或可能与 Prettier 冲突的 ESLint 规则。
pnpm add eslint-config-prettier prettier -D
.eslintrc.js 修改
添加 .prettierrc.json
添加 .prettierignore
格式化代码
npx prettier --write .
pnpm add husky lint-staged -D
npm pkg set scripts.prepare=“husky install”
package.json 生成命令
npm run prepare
根目录生成 .husky 文件夹
npx husky add .husky/pre-commit “npx lint-staged”
.husky 文件夹 生成 pre-commit
pre-commit
package.json
下载
添加 commitlint.config.js
注意 如果是命令创建注意修改编码为 utf-8
使用 Husky 的 commit-msg 钩子
commitlint.config.js
1:0 error Parsing error: Invalid character
echo "module.exports 编码不是utf-8
把 commitlint.config.js 编码格式改为 utf-8
在你使用git拉取代码的时候,git会自动将代码当中与你当前系统不同的换行方式转化成你当前系统的换行方式,从而造成这种冲突。
解决方案 vscode
-
在设置里Eol 选
-
修改git全局配置,禁止git自动将lf转换成crlf, 命令 然后重新克隆项目
git config --global core.autocrlf false
useElementSize 获取不到元素的边距,可以嵌套一层给内层元素添加边距
rows=“1”
autosize
基于 button 组件二次封装时,想要之前的属性 v-bind=“$attrs”
添加完之后你会发现 click 事件多次触发 inheritAttrs:false
注意 Dialog 要设置 closeOnPopstate: false 否则后面会出现弹框一闪
closeOnPopstate 是否在页面回退时自动关闭
如果当前页还有其他路由跳转或者确定之后跳转其他页面(出现死循环)
修改如下
腾讯选点组件
loadJs
terser not found. Since Vite v3, terser has become an optional dependency. You need to install it.
下载
配置
vite.config.ts
src/main.ts
编写通用组件
src/components/svgIcons/index.vue
tsconfig.json
使用
svg存放的地址
如果是文件夹以 - 拼接
例1:src/assets/mask_star.svg
例2:src/assets/mine/mask_star.svg
引入组件
测试公众号申请地址
配置
代码
测试
下载
wx.d.ts
使用
在公众号里进入分享手机端才可以展示自定义标题
下载
vite.config.ts
引入使用
下载
vite.config.ts
tsconfig.json