🐛 [Bug]: ESLint & StyleLint 问题清零 #211
Labels
Milestone
Comments
|
已完成 |
|
截止到 commit 5d660db，1.0 版本各组件的单元测试和ESLint情况如下：
|
单元测试自检全量单元测试 pnpm test单个组件单元测试 pnpm test --filter vue-devui -- --testMatch **/button.spec.ts **/fullscreen.spec.tsESLint 规范自检全量 ESLint pnpm eslint单个组件 ESLint ./node_modules/.bin/eslint "packages/**/{alert,loading}/**/{*.ts,*.tsx}" |
ESLint 问题修复案例案例1：warning Unexpected any. Specify a different type @typescript-eslint/no-explicit-any该问题出现频率比较高，原因是有些类型写了 比如Pagination组件的单元测试文件 const wrapper = mount({
components: {
DPagination
},
template: `<d-pagination ... />`
}, globalOption);
const btns = wrapper.findAll('a.devui-pagination-link');
expect(btns.map((ele: any) => ele.text()).join()).toEqual('<,1,...,4,5,6,...,16,>');其中的 解决办法是给 import { DOMWrapper } from '@vue/test-utils';
expect(btns.map((ele: DOMWrapper<Element>) => ele.text()).join()).toEqual('<,1,...,4,5,6,...,16,>');案例2：'xxx' was used before it was defined no-use-before-define这也是一个比较常见的问题，在声明之前使用变量或方法，解决办法也很简单，只需要调整下代码的顺序即可，将变量或方法的声明放在调用的语句之前。 比如Pagination组件的 // 极简模式下，可选的下拉选择页码
const litePageOptions = computed(() => liteSelectOptions(totalPages.value));
// 当前页码
const cursor = computed({
get() {
// 是否需要修正错误的pageIndex
if (!props.showTruePageIndex && props.pageIndex > totalPages.value) {
emit('update:pageIndex', totalPages.value || 1);
return totalPages.value || 1;
}
return props.pageIndex || 1;
},
set(val: number) {
emit('update:pageIndex', val);
}
});
// 总页数
const totalPages = computed(() => Math.ceil(props.total / props.pageSize));其中的 解决的方法就是将 // 总页数
const totalPages = computed(() => Math.ceil(props.total / props.pageSize));
// 极简模式下，可选的下拉选择页码
const litePageOptions = computed(() => liteSelectOptions(totalPages.value));
// 当前页码
const cursor = computed({ ... }); |
案例3：warning Missing return type on function @typescript-eslint/explicit-module-boundary-types该问题是因为函数缺少返回类型，比如Fullscreen组件 export const launchImmersiveFullScreen = async (docElement: any) => {
let fullscreenLaunch = null;
if (docElement.requestFullscreen) {
fullscreenLaunch = docElement.requestFullscreen();
} else if (docElement.mozRequestFullScreen) {
fullscreenLaunch = docElement.mozRequestFullScreen();
} else if (docElement.webkitRequestFullScreen) {
fullscreenLaunch = Promise.resolve(docElement.webkitRequestFullScreen());
} else if (docElement.msRequestFullscreen) {
fullscreenLaunch = Promise.resolve(docElement.msRequestFullscreen());
}
return await fullscreenLaunch.then(() => !!document.fullscreenElement);
};先看下 interface CompatibleHTMLElement extends HTMLElement {
mozRequestFullScreen?: () => void;
webkitRequestFullScreen?: () => void;
msRequestFullscreen?: () => void;
}这里定义了一个 export const launchImmersiveFullScreen = async (docElement: CompatibleHTMLElement) => {
...
}再来看下 return await fullscreenLaunch.then(() => !!document.fullscreenElement);该方法返回了一个 |
案例4：'xxx' is already declared in the upper scope @typescript-eslint/no-shadow这个问题是由于嵌套的作用域中定义了相同的变量名，比如Tree组件的 export default function useChecked(...) {
const onNodeClick = (item: TreeItem) => {
// 这里定义了 id 变量
const { id } = item;
...
filter 里面又定义了一个 id 参数
const currentSelectedItem = flatData.filter(({ id }) => currentSelected[id] && currentSelected[id] !== 'none');
...
}
}修改方式就是将其中一个 id 的名字改了，比如把里面的 id 改成 itemId： const currentSelectedItem = flatData.filter(({ id: itemId }) => currentSelected[itemId] && currentSelected[itemId] !== 'none'); |
|
2022.3.31 Update 截止到 commit 49e7933，
|
Closed
|
2022.4.1 Update 截止到 commit22f5fe1，
|
|
2022.4.8 Update 截止到 commit af1d0e1，1.0版本范围内40个组件的ESLint问题已全部修复，L0单元测试已全部补齐！🎉🥳 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2022.4.8 更新
1.0版本范围内40个组件的
ESLint问题已全部修复，L0单元测试已全部补齐！🎉🥳2022.3.31 更新
ESLint和单元测试最新进展如下：#211 (comment)
2022.3.28 更新
增加 cli 命令进行 eslint 和单元测试自检脚本：
code-check。默认检查所有已完成组件的 eslint 和 单元测试：
只检查 eslint：
只检查单元测试：
只检查部分组件的 eslint 和 单元测试：
只检查部分组件的 eslint：
只检查部分组件的单元测试：
2022.3.15 更新
stylelint已全部修复eslint已自动修复部分问题请田主使用以下命令进行自检，并修复自己组件存在的问题，欢迎在评论区分享修复经验：
./node_modules/.bin/eslint "packages/**/fullscreen/**/{*.ts,*.tsx}"执行以下命令可以检测存在的
eslint和stylelint问题，并修复能修复的问题：请大家通过执行以上命令，发现自己负责的组件的问题，并进行修复，修复经验可通过直接回复此
issue进行经验的沉淀，供其他田主参考。The text was updated successfully, but these errors were encountered: