vue typescript admin

관리자

Vue TypeScript를 기반으로 구축된 개발 환경입니다. 다중 페이지 개발을 지원합니다. 질문이 있으시면 이슈를 제출하시거나 다른 방법으로 저에게 연락해주세요.

기술 스택

• 뷰
• 뷰 라우터
• 뷰엑스
• vue-i18n
• 요소 UI
• 액시오스
• 타이프스크립트 중국어 버전

특성

• Vue 2.0 제품군 버킷 환경 도입
• 구성된 웹팩
• UI 라이브러리가 구성되었습니다 - element-ui
• 사용된 TypeScript
• FP를 빠르게 시작하려면 lodash를 도입하세요.

프로젝트는 비ts 파일 개발 모드를 지원하지 않으며 내장된 테스트 모듈이 없습니다. 필요한 경우 직접 추가할 수 있습니다.

카탈로그 설명

 ├── README.md
├── build // 项目构建文件
├── config // 项目构建配置
├── dist  // 打包构建后的文件夹
├── index.html // 默认模板文件
├── package.json
├── .postcssrc.js // postcss 配置文件
├── tsconfig.json // typescript 配置文件
├── tslint.json // tslint 配置文件
└── src
    ├── Basic.ts // 入口文件基础配置
    ├── Http.ts // 创建 axios 做基本配置 及 http 拦截器配置文件
    ├── Filters.ts // 增加 Vue 可用过滤器
    ├── assets
    │   ├── icons  // svg 图标
    │       └── index.ts // 导入 icons 目录下的所有 svg 文件，返回 svg 集合对象
    │   ├── images
    │   └── style 
    │       ├── theme  // element-ui 样式库
    │       ├── element-variables.css  // element-ui 变量文件
    │       └── ...  // 自定义 样式 支持 scss postCSS
    ├── common  // 公共组件
    │   ├── Icon.ts  // Icon 组件
    │   └── index.ts // 读取 common 目录下的所有 ts 文件，返回 组件集合对象
    ├── config // 公共常量
    ├── entry // 默认入口文件目录 可以在 ./config/index.js 修改
    ├── i18n // vue-i18n 国际化配置
    ├── router // vue-router 路由配置
    ├── store // vuex 配置
    │   ├── modules
    │   ├── types 
    │   ├── actions.ts
    │   ├── getters.ts
    │   └── index.ts // 返回 vuex store 对象
    ├── typings // TS类型声明文件
    └── views 

UI 테마 구성은 element-ui 공식 custom-theme을 참고하세요.

프로젝트 시작

 # 下载依赖
npm install  or yarn

# 开启服务热更新 localhost:3000
npm run dev

# 导出生产包
npm run build

# 导出生产包并查看包分析报告
npm run build --report