第二周个人周报-191211黎命东

191211-黎命东 2025-03-17 08:45:26

 

一、本周计划任务与实际完成任务

任务类别计划任务实际完成内容耗时(小时)
学习任务完成Vue3路由、组件通信学习完成Vue3路由(Vue Router)及组件通信(props/emits、provide/inject、Pinia状态管理)学习,并通过案例巩固24
项目开发搭建项目基础框架完成项目模板搭建:集成ElementPlus、Pinia、路由配置、Layout布局,统一包管理器为pnpm18
功能开发实现登录功能完成登录页开发(账号校验、路由跳转),Home页Layout布局及侧边栏动态路由配置16
模块开发开发日程日历模块实现日历展示,切换年月日,展示节日节气、日程增删改功能(未完成根据时间自动排序日程)12
工具配置配置ESLint/Stylelint完成ESLint、Stylelint、Prettier配置,解决新版工具链兼容性问题24
问题排查与优化解决开发环境问题更新WebStorm至2024版,修复Vue3类型声明问题,优化项目目录结构4

二、个人工作中存在的问题及应对措施

  1. 问题:ESLint/Stylelint配置困难

    • 原因:新版工具链文档不完善,旧版配置方案失效。

    • 措施:通过安装过程中的警告信息得到废弃依赖,再查阅CSDN和官网的英文文档替换为新包(如用@stylistic/eslint-plugin替代旧版样式插件),并且配置相应的语法

  2. 问题:WebStorm2023对Vue3支持不足

    • 原因:旧版IDE对Vue3类型声明和TS语法支持滞后。

    • 措施

      • env.d.ts中手动补充*.vue模块声明,确保TS类型推导正常。(原方案,现弃用)

      • 升级WebStorm至2024版,利用内置Vue3支持解决类型报错;(最终方案)

  3. 问题:项目目录结构混乱

    • 原因:社区规范多样,缺乏统一标准。

    • 措施:参考尚硅谷企业级项目规范,采用分层结构:比如src/components存放可复用组件,src/layout存放主页面布局组件,src/views存放页面级组件,src/views/compoents存放页面级组件的子组件,页面级组件的入口组件统一命名为index.vue


三、个人学习的新知识点及学习途径

知识点学习内容学习途径
Vue Router动态路由匹配、导航守卫、路由懒加载Vue3官方文档、B站“尚硅谷”Vue3视频
Pinia状态管理Store定义、组合式API、持久化存储方案Pinia中文文档、CSDN开发者经验、B站“尚硅谷”Vue3视频
ESLint/Stylelint配置新版插件语法(如@stylistic/eslint-plugin)、自定义规则优先级官方文档、CSDN开发者经验帖、B站最新Eslint/Stylelint基础教程
工程化规范项目目录规范,代码规范,页面结构规范,命名规范,环境统一B站尚硅谷Vue3实战课程

四、个人工作感悟 

  1. 工程化思维的提升

    • 通过配置代码规范工具,深刻认识到标准化开发流程对团队协作的重要性。例如,强制使用const/let替代已经废弃的var、统一字符串为单引号格式,不允许使用any类型等,从源头减少代码风格争议。

    • 工具链的迭代速度远超预期,需保持持续学习:新版ESLint/Stylelint废弃了许多插件,新版与旧版差距较大,需主动关注生态变化。

  2. 问题解决能力的锻炼

    • 面对WebStorm的Vue文件爆红问题,最初更改配置文件可以让ts识别vue,但是提出疑问,既然是vue3项目,为什么官方不内置vue的类型声明,而是需要用户手动配置?接着尝试了在VsCode中运行无报错,定位了根源为IDE。思考可能是IDE版本低,插件不兼容导致。最后下载最新的IDE,彻底解决了爆红的问题,不需要用户手动配置,并且获得了更强大的vue生态支持。

    • 配置工具链时,先使用旧版方案,通过pnpm安装日志的警告信息获取废弃包提示,再根据提示信息去CSDN和官网寻找替代方案。这一经验可迁移至其他技术调研场景。

  3. 团队协作意识的深化

    • 编写项目模板时,刻意设计低侵入性架构:小组成员仅需关注views目录下的业务模块开发,无需理解底层路由或状态管理逻辑,降低新人上手成本。

    • 通过强制代码格式化(EsLint/StyleLint)和包管理器统一(pnpm),减少因环境差异导致的运行问题,体现“约定优于配置”的设计原则。

  4. 不足与改进方向

    • 功能完善

      • 日历日程按时间排序

      • 优化页面美观(如图标、配色)

    • 团队协作

      • 添加代码提交前自动检查(防止不规范代码上传)

      • 对接后端接口(当前登录和日程数据是假数据)

    • 个人学习

      • 学习状态管理工具(如Pinia模块化)

      • 掌握接口请求工具(如axios)


总结:本周是从学习到实战的过渡阶段,既巩固了Vue3核心技能,也初次体验了工程化落地的复杂性。最大的收获是意识到:工具链的熟练度与架构设计能力,与技术实现同等重要。后续将会继续更新模版和实现功能,同时持续完善个人技术体系。

...全文
34 回复 打赏 收藏 转发到动态 举报
写回复
用AI写文章
回复
切换为时间正序
请发表友善的回复…
发表回复

201

社区成员

发帖
与我相关
我的任务
社区描述
CUG软件工程基础学习社区
团队开发软件工程敏捷流程 高校 湖北省·武汉市
社区管理员
  • EasonBeckham
  • h6ldZywoo
  • Ex~spirit
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧