# watermark **Repository Path**: li3346756362/watermark ## Basic Information - **Project Name**: watermark - **Description**: 前端实现水印的技术方案 - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 2 - **Created**: 2025-04-18 - **Last Updated**: 2025-04-18 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README ### 遇到的问题 执行npm run build后 (vue-tsc --noEmit --skipLibCheck && vite build)报错: ```js src/router/index.ts:1:40 - error TS6133: 'createWebHashHistory' is declared but its value is never read. 1 import { RouteRecordRaw, createRouter, createWebHashHistory, createWebHistory } from 'vue-router'; ~~~~~~~~~~~~~~~~~~~~ src/router/index.ts:69:20 - error TS6133: 'to' is declared but its value is never read. 69 router.beforeEach((to, from, next) => { ~~ src/router/index.ts:69:24 - error TS6133: 'from' is declared but its value is never read. 69 router.beforeEach((to, from, next) => { ~~~~ src/router/index.ts:73:19 - error TS6133: 'to' is declared but its value is never read. 73 router.afterEach((to, from, next) => { ~~ src/router/index.ts:73:23 - error TS6133: 'from' is declared but its value is never read. 73 router.afterEach((to, from, next) => { ~~~~ src/router/index.ts:73:29 - error TS6133: 'next' is declared but its value is never read. 73 router.afterEach((to, from, next) => { ~~~~ src/views/home/components/ChatWindow.vue:49:33 - error TS2322: Type 'unknown' is not assignable to type 'string'. 49 :placeholder="field.placeholder" ~~~~~~~~~~~~ node_modules/.pnpm/@vue+runtime-dom@3.3.4/node_modules/@vue/runtime-dom/dist/runtime-dom.d.ts:520:5 520 placeholder?: string; ~~~~~~~~~~~ The expected type comes from property 'placeholder' which is declared here on type 'InputHTMLAttributes & ReservedProps & Record' src/views/home/components/ChatWindow.vue:56:33 - error TS2322: Type 'unknown' is not assignable to type 'string'. 56 :placeholder="field.placeholder" ~~~~~~~~~~~~ node_modules/.pnpm/@vue+runtime-dom@3.3.4/node_modules/@vue/runtime-dom/dist/runtime-dom.d.ts:520:5 520 placeholder?: string; ~~~~~~~~~~~ The expected type comes from property 'placeholder' which is declared here on type 'InputHTMLAttributes & ReservedProps & Record' src/views/home/components/ChatWindow.vue:63:33 - error TS2322: Type 'unknown' is not assignable to type 'string'. 63 :placeholder="field.placeholder" ~~~~~~~~~~~~ node_modules/.pnpm/@vue+runtime-dom@3.3.4/node_modules/@vue/runtime-dom/dist/runtime-dom.d.ts:684:5 684 placeholder?: string; ~~~~~~~~~~~ The expected type comes from property 'placeholder' which is declared here on type 'TextareaHTMLAttributes & ReservedProps & Record' src/views/home/components/ChatWindow.vue:72:52 - error TS2339: Property 'value' does not exist on type 'never'. 72 :value="option.value" ~~~~~ src/views/home/components/ChatWindow.vue:74:47 - error TS2339: Property 'label' does not exist on type 'never'. 74 {{ option.label }} ~~~~~ src/views/home/components/ChatWindow.vue:84:56 - error TS2339: Property 'value' does not exist on type 'never'. 84 :value="option.value" ~~~~~ src/views/home/components/ChatWindow.vue:87:47 - error TS2339: Property 'label' does not exist on type 'never'. 87 {{ option.label }} ~~~~~ src/views/home/components/ChatWindow.vue:96:56 - error TS2339: Property 'value' does not exist on type 'never'. 96 :value="option.value" ~~~~~ src/views/home/components/ChatWindow.vue:99:47 - error TS2339: Property 'label' does not exist on type 'never'. 99 {{ option.label }} ~~~~~ src/views/home/components/ChatWindow.vue:103:55 - error TS6133: 'index' is declared but its value is never read. 103 '. 26 if (newMessage.trim() !== '') { ~~~~ vite.config.ts:11:11 - error TS6133: 'env' is declared but its value is never read. 11 const env = loadEnv(mode, root); ~~~ Found 20 errors in 4 files. Errors Files 6 src/router/index.ts:1 11 src/views/home/components/ChatWindow.vue:49 2 src/views/login/index.vue:21 1 vite.config.ts:11 ``` 解决方案如下: https://blog.csdn.net/qq_27449993/article/details/127304996 问题2: 添加了eslint 和 prittier 之后,发现代码格式化后,eslint 报错 需要在 .eslintrc.js 中添加如下配置: ```js // 自定义规则 rules: { indent: 4, }, ``` 问题3:安装styleLint ```bash pnpm install -D stylelint-config-prettier stylelint-config-html stylelint-order stylelint-less postcss-html postcss-less stylelint-config-standard-vue ``` stylelint-config-standard:StyleLint 推荐配置 stylelint-config-prettier:关闭与 prettier 冲突的配置 stylelint-config-standard-vue:StyleLint Vue 项目推荐配置 postcss-html postcss-less:支持检查 less 与 html 问题4: ```js ✖ eslint --fix: /Users/baidu/Desktop/ke/前端工程化/vite-vue3-template/src/views/home/index.vue 1:1 error Component name "index" should always be multi-word vue/multi-word-component-names /Users/baidu/Desktop/ke/前端工程化/vite-vue3-template/src/views/login/index.vue 1:1 error Component name "index" should always be multi-word vue/multi-word-component-names 32:7 error 'typingText' is assigned a value but never used @typescript-eslint/no-unused-vars ``` 原因: 原因是 eslint-plugin-vue 版本更新了,相较之前版本,@9 版本中新增了不少规则, 第一条就是 'vue/multi-word-component-names': 'error', 要求组件名称以驼峰格式命名,所以 index.vue 会报错。 解决方案: 1. 改成驼峰命名的方式 比如:HomeIndex.vue 1. 修改 .eslintrc.js 关闭对应的mutil-word-component-names规则 ```js "vue/multi-word-component-names": [ "error", { ignores: ["index"], //需要忽略的组件名 }, ], ``` stylelint-order:支持 css 样式排序 ## 问题记录 Cannot find module or its corresponding type declarations. 解决方案参考: https://blog.csdn.net/fifteen718/article/details/131088377 ## 持续更新 git config user.email "dawei@163.com"