## gm前端 ## 参考文档 - https://jekip.github.io/docs/guide/introduction.html ## 环境准备 本地环境需要安装 Yarn1.x、Node.js 和 Git - 注意 必须使用Yarn1.x,否则依赖可能安装不上。 Node.js 版本要求12.x以上,且不能为13.x版本,这里推荐 14.x 及以上。 ## npm script ```js "scripts": { # 安装依赖 "bootstrap": "yarn install", # 运行项目 "serve": "npm run dev", # 运行项目 "dev": "vite", # 构建项目 "build": "vite build && esno ./build/script/postBuild.ts", # 清空缓存后构建项目 "build:no-cache": "yarn clean:cache && npm run build", # 生成打包分析,在 `Mac OS` 电脑上执行完成后会自动打开界面,在 `Window` 电脑上执行完成后需要打开 `./build/.cache/stats.html` 查看 "report": "cross-env REPORT=true npm run build", # 预览打包后的内容(先打包在进行预览) "preview": "npm run build && vite preview", # 直接预览本地 dist 文件目录 "preview:dist": "vite preview", # 删除缓存 "clean:cache": "rimraf node_modules/.cache/ && rimraf node_modules/.vite", # 删除 node_modules (`window` 系统手动删除该目录较慢,可以使用该命令来进行删除) "clean:lib": "rimraf node_modules", # 执行 eslint 校验,并修复部分问题 "lint:eslint": "eslint \"{src,mock}/**/*.{vue,ts,tsx}\" --fix", # 执行 prettier 格式化(该命令会对项目所有代码进行 prettier 格式化,请谨慎执行) "lint:prettier": "prettier --write --loglevel warn \"src/**/*.{js,json,tsx,css,less,scss,vue,html,md}\"", # 执行 stylelint 格式化 "lint:stylelint": "stylelint --fix \"**/*.{vue,less,postcss,css,scss}\" --cache --cache-location node_modules/.cache/stylelint/", "lint:lint-staged": "lint-staged -c ./.husky/lintstagedrc.js", "lint:pretty": "pretty-quick --staged", # 重新安装依赖,见下方说明 "reinstall": "rimraf yarn.lock && rimraf package.lock.json && rimraf node_modules && npm run bootstrap", }, ``` ## 目录说明 ``` . ├── build # 打包脚本相关 │   ├── config # 配置文件 │   ├── generate # 生成器 │   ├── script # 脚本 │   └── vite # vite配置 ├── mock # mock文件夹 ├── public # 公共静态资源目录 ├── src # 主目录 │   ├── api # 接口文件 │   ├── assets # 资源文件 │   │   ├── icons # icon sprite 图标文件夹 │   │   ├── images # 项目存放图片的文件夹 │   │   └── svg # 项目存放svg图片的文件夹 │   ├── components # 公共组件 │   ├── design # 样式文件 │   ├── directives # 指令 │   ├── enums # 枚举/常量 │   ├── hooks # hook │   │   ├── component # 组件相关hook │   │   ├── core # 基础hook │   │   ├── event # 事件相关hook │   │   ├── setting # 配置相关hook │   │   └── web # web相关hook │   ├── layouts # 布局文件 │   │   ├── default # 默认布局 │   │   ├── iframe # iframe布局 │   │   └── page # 页面布局 │   ├── locales # 多语言 │   ├── logics # 逻辑 │   ├── main.ts # 主入口 │   ├── router # 路由配置 │   ├── settings # 项目配置 │   │   ├── componentSetting.ts # 组件配置 │   │   ├── designSetting.ts # 样式配置 │   │   ├── encryptionSetting.ts # 加密配置 │   │   ├── localeSetting.ts # 多语言配置 │   │   ├── projectSetting.ts # 项目配置 │   │   └── siteSetting.ts # 站点配置 │   ├── store # 数据仓库 │   ├── utils # 工具类 │   └── views # 页面 ├── types # 类型文件 ├── vite.config.ts # vite配置文件 └── windi.config.ts # windcss配置文件 ```