Skip to content

vadxq/vite-vue-prod-template

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

31 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Vue 3 + Typescript + Vite

Vue3 工程化项目实践demo

intro

  • 编程语言:TypeScript 5.3.2
  • 构建工具:Vite 5
  • 前端框架:Vue 3.3.8
  • 路由工具:Vue Router 4.2.5
  • 状态管理:Pinia 2.1.7
  • CSS:Sass + Postcss
  • HTTP 工具:Axios
  • MOCK: mockjs + vite plugins
  • Git Hook 工具:Husky + Lint-staged
  • 代码规范:EditorConfig + Prettier + ESLint
  • 提交规范:Commitlint

初始化项目

npx degit https://github.com/vadxq/vite-vue-prod-template ./demo

更新日志

2023年11月重新更新优化本仓库

  • 支持vite v5版本
  • postcss配置更新:vite内联了postcss,可以不需要额外的创建 postcss.config.js文件
  • vite配置的弃用,在v5版本警示,v6版本会被移除
    • Vite CJS Node API deprecated:查找警告VITE_CJS_TRACE=true vite dev
  • 自适应方案变更,使用viewport来替代rem方案,新增postcss-px-to-viewport,去除lib-flexible。(这里是默认注释,有需求可以打开)
    • postcss-px-to-viewport 对内联css样式,外联css样式,内嵌css样式有效,对js动态css无效。 所以要动态改变css展示效果的话,要使用静态的class定义变化样式,通过js改变dom元素的class实现样式变化
  • autoprefixer移除,使用postcss-preset-env替代
  • 删除了注释的vuex示例
  • 增加tailwindcss
  • stylelint规则变更,更新适配至stylelint v15版本
  • eslint规则变更,适配最新版
  • 新增vscode自动保存格式化和检测规则
  • 依赖包更新

详见更新日志

之前版本请看分支v1.0.0