{"id":18840241,"url":"https://github.com/hawx1993/hbuild","last_synced_at":"2025-04-14T07:07:21.098Z","repository":{"id":57261926,"uuid":"90594499","full_name":"hawx1993/hbuild","owner":"hawx1993","description":"⚔repaid build web/vue/react project starter kit with cli","archived":false,"fork":false,"pushed_at":"2018-07-06T04:45:16.000Z","size":201,"stargazers_count":37,"open_issues_count":0,"forks_count":2,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-03-27T20:44:57.529Z","etag":null,"topics":["hbuild","react-scaffold","scaffold","starter-kit","vue-scaffold"],"latest_commit_sha":null,"homepage":"https://github.com/hawx1993/hbuild-cli","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/hawx1993.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-05-08T06:37:21.000Z","updated_at":"2023-08-19T07:14:47.000Z","dependencies_parsed_at":"2022-08-25T06:11:02.788Z","dependency_job_id":null,"html_url":"https://github.com/hawx1993/hbuild","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hawx1993%2Fhbuild","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hawx1993%2Fhbuild/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hawx1993%2Fhbuild/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hawx1993%2Fhbuild/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/hawx1993","download_url":"https://codeload.github.com/hawx1993/hbuild/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248519487,"owners_count":21117760,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["hbuild","react-scaffold","scaffold","starter-kit","vue-scaffold"],"created_at":"2024-11-08T02:46:56.796Z","updated_at":"2025-04-14T07:07:21.059Z","avatar_url":"https://github.com/hawx1993.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\n### \u003cp align='center'\u003eAbout Hbuild\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg src=\"http://chuantu.biz/t5/92/1495463272x1822614086.png\" alt=\"vuepack\" width=\"60\"\u003e\n  \u003cbr\u003e\u003cbr\u003e\u003cstrong\u003eHbuild\u003c/strong\u003e is a modern project starter kit\u003cbr\u003ewhich  allows you to build your own project by cli rapidly\n\u003c/p\u003e\n\n\n\nHbuild使用[hbuild-cli](https://github.com/hawx1993/hbuild-cli)命令行工具，全局注册后可快速生成项目启动套件。你可以使用Hbuild生成一个h5项目，或者vue项目（默认搭配react-router，可自由选择vuex），或者react项目。该套件包含如下特点：\n\n\n### Features\n\n- Vue2 / Vue-Router / Vuex (optional)\n- Hot reloading for single-file components\n- Webpack 2\n- babel (default)\n- LESS/SASS/Stylus (optional)\n- ejs/mustache/art-template (optional)\n- React / React-Router (optional)\n- zepto\n- autoprefixer (vue support)\n- mock server\n- eslint\n- Support for building multi-page applications\n- offline mode support\n- [file hash](https://github.com/hawx1993/hbuild/blob/master/docs/filehash.md)\n\n其中[zepto](https://github.com/hawx1993/hbuild/blob/master/docs/zepto.md)是默认全局引入的，可直接使用。h5项目可以选择`ejs，mustache`或`art-template`模板引擎。 默认支持Babel转码。支持HMR。支持[文件指纹](https://github.com/hawx1993/hbuild/blob/master/docs/filehash.md)。\n\nvue项目默认支持`vue-router`，react项目默认支持`react-router`，暂不支持直接通过命令行选择`react-redux`，可直接自行通过npm包安装，可以正常编译\n\n\n### Get Started\n\n\nYou'd better have node \u003e=6 and npm \u003e=3 and gulp \u003e=3.9 installed:\n\n```bash\n$ npm install -g hbuild-cli\n$ h init new-project\n\n# edit files and start developing\n$ npm start\n# bundle all scripts and styles for production use\n$ npm run build\n```\n\n\n### Local Templates\n\nwhen you clone this project,you can  use a template on your local file system:\n\n```bash\n$ git clone git@github.com:hawx1993/hbuild.git\n$ h init ./hbuild new-project\n```\n### 命令\n\n```\n$ npm run start;//本地开发模式，连接mock数据\n$ npm run dev-daily;//本地开发模式，连接daily日常环境数据\n$ npm run dev-pre;//本地开发模式，连接预发环境数据\n$ npm run daily;//线上日常构建模式，连接daily日常环境数据\n$ npm run pre;//线上预发构建模式，连接预发环境数据\n$ npm run build;//线上构建模式，连接线上环境数据\n```\n\n### 编译\n\n1.js代码默认采用Babel编译，gulp + webpack打包构建。\n\n2.编译后的html文件默认输出到`build/pages`目录下，html文件名采用其在`src/pages`下的父级目录的文件名\n\n3.编译后的静态资源文件（图片，字体，js文件等）存放到`build/static`目录下，编译支持文件hash，解决缓存问题\n\n4.支持代码热替换，热替换失败会自动刷新整个页面\n\n5.开发模式不对代码进行压缩，sourceMap 只针对非开发模式有效(not dev)\n\n6.支持图片压缩\n\n7.支持生产环境拷贝mock数据至编译目录\n\n### HTML和模板引擎\n\n1.h5项目支持 ejs ，mustache和`art-template`模板引擎，默认支持`zepto`\n\n2.非本地开发环境，html，js和css代码会被压缩\n\n3.当你在pages下新建一个目录时，html文件需要手动配置一下静态资源的引用，例如在index目录下：\n\n```javascript\n\u003cscript src=\"$$_CDNPATH_$$/index/index.js\"\u003e\u003c/script\u003e\n```\n\n### CSS和预处理器\n\n1.支持css预处理器LESS、SASS和stylus (optional);\n\n2.默认采用`css-in-js`的方式，可在`hbuild.config.js`文件中配置是否单独提取css，提取出的css文件名称默认为：`[name].css`，name为src下`less/scss/stylus`文件名\n\n3.开启提取css文件，需要在HTML中引入，引入方式同js\n\n4.支持 屏幕适配方案，采用`media-query+rem`的方式，默认在`common.less`文件中\n\n5.支持postcss和`autoprefixer`\n\n\n### 代码检查\n\n1.当你执行`git commit`的时候，会自动触发执行eslint，支持vue和react单文件组件，支持es6语法检查\n\n### 其他\n\n- mock：mock 数据只需要接口URI路径和mock目录保持一致即可\n\n- 接口：接口如需根据环境来替换，需在`hbuild.config.js`文件和`common/js/config`文件进行配置\n\n- 支持多入口文件，可在pages下新建目录，文件名需以index开头\n\n- 字符串替换：`$$_CDNPATH_$$`会被编译替换为`build/static/hash`目录，`$$_STATICPATH_$$`会被替换为`build/static/hash/assets`\n\n- 入口文件：脚手架默认会读取pages目录下的index开头的js文件为入口文件，名称是写死的\n\n- 修改默认文件夹的名称，需要在`hbuild.config.js`文件就对应文件变量做修改\n\n\n### 目录结构\n\n```bash\n.\n├── README.md\n├── build                       # 构建工具目录\n│    └── gulpfile.babel.js            # gulp文件\n│    └── postcss.config.js      # postcss配置文件\n│    └── util.js                # gulp脚手架工具方法\n│    └── hbuild.config.js       # 脚手架配置文件\n├── mock                        # mock数据目录，保持和接口一样的路径即可\n│   └── h5\n├── package.json    \n├── src                         # 源文件\n│   ├── assets                  # 静态资源目录，存放图片或字体\n│   │   └── logo.ico\n│   ├── common                  # 共用代码目录，css目录存放公用css部分，js同理\n│   │   ├── css\n│   │   │   ├── common.less\n│   │   │   └── common.scss\n│   │   └── js\n│   │       ├── api.js          # api文件\n│   │       ├── config.js       # 配置文件\n│   │       └── util.js         # 工具函数文件，可将公用方法存放于此\n│   ├── components              # 组件目录\n│   │   ├── counter             # 计数器vue组件\n│   │   │   └── index.vue\n│   │   ├── index               # vue组件的入口文件\n│   │   │   └── index.vue\n│   │   ├── meta                # h5 meta头部信息模块\n│   │   │   └── index.html\n│   │   ├── router              # vue路由模块\n│   │   │   └── router.js\n│   │   └── store               # vuex store模块\n│   │       └── store.js\n│   ├── lib                     # 第三方库\n│   └── pages                   # 页面    \n│       └── index               # 首页目录，可在pages目录下新建多个目录结构，作为多入口文件\n│           ├── index.html\n│           ├── index.js        # index.js/index.jsx文件为webpack的入口文件\n│           ├── index.jsx\n│           ├── index.less      # 样式文件在js文件中引入，可设置是否提取出css文件     \n│           ├── index.scss\n│           └── module          # 页面模板模块，可在index.js/jsx文件引入该模块文件\n│               ├── main.jsx\n│               └── main.tpl.html\n└── yarn.lock\n```\n\n\n### ChangeLog\n\n[view changelog](https://github.com/hawx1993/hbuild/blob/master/docs/ChangeLog.md)\n\n### License\n\nMIT © [hawx1993](https://github.com/hawx1993)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhawx1993%2Fhbuild","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhawx1993%2Fhbuild","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhawx1993%2Fhbuild/lists"}