{"id":15021461,"url":"https://github.com/balmjs/balm","last_synced_at":"2025-04-09T22:12:43.337Z","repository":{"id":8859395,"uuid":"59972346","full_name":"balmjs/balm","owner":"balmjs","description":":black_joker: An universal Front-End workflow for webapps","archived":false,"fork":false,"pushed_at":"2024-11-27T06:29:16.000Z","size":21338,"stargazers_count":28,"open_issues_count":1,"forks_count":8,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-04-01T18:16:50.376Z","etag":null,"topics":["balm","front-end","gulp","nodejs","webapp","webpack","workflow"],"latest_commit_sha":null,"homepage":"https://balm.js.org","language":"TypeScript","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/balmjs.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"open_collective":"balmjs","custom":["https://material.balmjs.com/#/donate"]}},"created_at":"2016-05-30T01:37:26.000Z","updated_at":"2025-01-14T16:00:40.000Z","dependencies_parsed_at":"2024-01-08T01:05:08.688Z","dependency_job_id":"6c8f578e-f8d9-4146-af6d-9d14b56df647","html_url":"https://github.com/balmjs/balm","commit_stats":{"total_commits":1877,"total_committers":4,"mean_commits":469.25,"dds":0.003196590303676028,"last_synced_commit":"362c43827085f97318530c9dabe5ea36e34ea38c"},"previous_names":[],"tags_count":138,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/balmjs%2Fbalm","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/balmjs%2Fbalm/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/balmjs%2Fbalm/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/balmjs%2Fbalm/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/balmjs","download_url":"https://codeload.github.com/balmjs/balm/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247362726,"owners_count":20926828,"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":["balm","front-end","gulp","nodejs","webapp","webpack","workflow"],"created_at":"2024-09-24T19:56:36.400Z","updated_at":"2025-04-09T22:12:43.317Z","avatar_url":"https://github.com/balmjs.png","language":"TypeScript","funding_links":["https://opencollective.com/balmjs","https://material.balmjs.com/#/donate"],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n  \u003ca href=\"https://balm.js.org/\"\u003e\n    \u003cimg width=\"128\" heigth=\"128\" src=\"https://balm.js.org/logo.png\" alt=\"BalmJS\"\u003e\n  \u003c/a\u003e\n  \u003cbr\u003e\n  \u003cbr\u003e\n\n[![NPM version][balm-image]][balm-url]\n[![License][license-image]][license-url]\n[![Coverage Percentage][cover-image]][cover-url]\n\n  \u003ch1\u003eBalmJS\u003c/h1\u003e\n  \u003cp\u003eAn universal Front-End workflow for webapps\u003c/p\u003e\n\u003c/div\u003e\n\n\u003e [`balm@3`](https://github.com/balmjs/balm/tree/master)(v3) supports for `node@10.13.0+`, `postcss@7`, `webpack@4`\n\n## Introduction\n\nBalmJS prescribes best practices and tools to help you stay productive.\n\n- **Naturally**: Make web development _simple_, _natural_ and _pleasant_.\n- **Structure-Based**: _One configuration file_ can manage webapp projects with at least 90% use cases.\n- **Learn Once, Run Any Webapps**: Any front-end technology stack will be developed and built in _the same way_.\n\n## Features\n\n- Based on **gulp + webpack** for webapp projects\n- Automagically compile PostCSS/Sass/Less\n- CSS Autoprefixing\n- Automagically generate CSS Image Sprites\n- enable ES2015+ features using Babel\n- Awesome images optimization\n- Built-in preview server with BrowserSync\n- Custom publish assets to remote (Front-end to Back-end) project\n- ZIP/FTP/PWA supported\n- Easily define and extend your own tasks\n\n## Structure\n\n:rocket: We recommend using [Balm CLI](https://github.com/balmjs/balm-cli) to scaffold out a front-end web app.\n\n```\nproject\n├── .tmp         // Scaffolds out a temporary directory for development\n├── dist         // Scaffolds out the production build\n├─┬ src          // Source code in here (Create a directory in project)\n│ ├── fonts\n│ ├── images\n│ ├── media\n│ ├─┬ scripts\n│ │ └── index.js // Required. A entry file for JS.\n│ ├─┬ styles\n│ │ └── main.css // Required. A entry file for CSS.\n│ └── index.html // Required. A entry file for HTML.\n├── .dotfile     // (e.g. .gitignore, .browserslistrc, etc...)\n├── babel.config.js\n├── balm.config.js // Required. A configuration file for Balm.\n├── package.json   // Required.\n└── ...\n```\n\n## Installation\n\n### 0. Requirements\n\nYou need to set up your development environment before you can do anything.\n\nInstall [Node.js® and npm](https://nodejs.org/en/download/) if they are not already on your machine.\n\n\u003e **Verify that you are running at least node `18.12.0`** by running `node -v` in a terminal/console window. Older versions maybe produce errors, but newer versions are fine.\n\nYou develop apps in the context of an [Balm workspace](https://balm.js.org/docs/guide/structure.html).\n\nTo create a new workspace and initial starter app:\n\n```sh\n# /path/to/YOUR_WORKSPACE\nmkdir -p my-project/src/{styles,scripts}\necho \"Hello World\" \u003e my-project/src/index.html\n\ncd my-project\nnpm init -y\n```\n\n### 1. Installing `balm`\n\n```sh\nyarn global add balm-core\nyarn add -D balm\n```\n\nOR\n\n```sh\nnpm install -g balm-core\nnpm install -D balm\n```\n\n\u003e We currently recommend using [Yarn](https://yarnpkg.com/en/docs/install) instead of npm.\n\n### 2. Configuration\n\nIn your project directory, create a file named `balm.config.js` in your project root with these contents:\n\n```js\nmodule.exports = {\n  // Your project config\n};\n```\n\n:page_with_curl: Refer to [configuration docs](https://balm.js.org/docs/config/) to learn more about config **`balm`**.\n\n### 3. Usage\n\nEdit `package.json` in your project directory:\n\n```json\n{\n  \"scripts\": {\n    \"dev\": \"balm\",\n    \"prod\": \"balm -p\"\n  }\n}\n```\n\nRun the command in your project directory:\n\n```sh\n# For development\nnpm run dev\n\n# For production\nnpm run prod\n```\n\n## Demo\n\n- [x] [HTML boilerplate](https://github.com/balmjs/demo-html5-boilerplate)\n- [x] [Laravel](https://github.com/balmjs/demo-laravel)\n- [x] [TypeScript](https://github.com/balmjs/demo-ts)\n- [x] Yours awesome projects...\n\n## Documentation\n\nTo download [example](https://balm.js.org/balm-example.zip) and try it, visit [balm.js.org](https://balm.js.org/docs/).\n\n- [Getting Started](https://balm.js.org/docs/guide/getting-started.html)\n- [Configuration](https://balm.js.org/docs/config/)\n- [Custom Task API](https://balm.js.org/docs/api/)\n- [Advanced Usage](https://balm.js.org/docs/advanced/)\n\n## Ecosystem\n\n| Project                                                    | Status                                                   | Description                                                        |\n| ---------------------------------------------------------- | -------------------------------------------------------- | ------------------------------------------------------------------ |\n| **[balm-core](https://github.com/balmjs/balm)**            | [![NPM version][balm-core-image]][balm-core-url]         | :black_joker: BalmJS compiler core (required for `balm 3.0+`)      |\n| **[balm](https://github.com/balmjs/balm)**                 | [![NPM version][balm-image]][balm-url]                   | :black_joker: BalmJS runtime core                                  |\n| **[balm-cli](https://github.com/balmjs/balm-cli)**         | [![NPM version][balm-cli-image]][balm-cli-url]           | :spades: BalmJS scaffolding tool                                   |\n| [balm-gui](https://github.com/balmjs/balm-gui)             | N/A                                                      | :clubs: GUI for BalmJS                                             |\n| [balm-ui-lite](https://github.com/balmjs/ui-vue-lite)      | [![NPM version][balm-ui-lite-image]][balm-ui-lite-url]   | :hearts: Material Design Lite + Vue                                |\n| **[balm-ui](https://github.com/balmjs/ui-vue)**            | [![NPM version][balm-ui-image]][balm-ui-url]             | :diamonds: Next Generation Material UI for Vue.js                  |\n| [balm-scroll](https://github.com/balmjs/balm-scroll)       | [![NPM version][balm-scroll-image]][balm-scroll-url]     | :scroll: Smooth scrolling for Vue.js                               |\n| **[balm-ui-pro](https://github.com/balmjs/balm-ui-pro)**   | [![NPM version][balm-ui-pro-image]][balm-ui-pro-url]     | More configuration definition, less code implementation for Vue.js |\n| **[balm-git-flow](https://github.com/balmjs/balm-ui-pro)** | [![NPM version][balm-git-flow-image]][balm-git-flow-url] | The best practices for front-end git flow                          |\n\n## Contributing\n\nWe'd love for you to contribute and make BalmJS even better than it is today! Please make sure to read the [Contributing Guide](https://github.com/balmjs/balm/blob/main/CONTRIBUTING.md) before making a [pull request](https://github.com/balmjs/balm/pulls). You can submit any ideas as pull requests or as [GitHub issues](https://github.com/balmjs/balm/issues).\n\n## License\n\n[MIT](https://opensource.org/licenses/MIT)\n\n© 2016-present, [Elf-mousE](http://elf-mouse.me/)\n\n[balm-core-image]: https://img.shields.io/npm/v/balm-core.svg\n[balm-core-url]: https://npmjs.org/package/balm-core\n[balm-image]: https://img.shields.io/npm/v/balm.svg\n[balm-url]: https://npmjs.org/package/balm\n[license-image]: https://img.shields.io/npm/l/balm-core.svg?sanitize=true\n[license-url]: https://www.npmjs.com/package/balm-core\n[cover-image]: https://coveralls.io/repos/balmjs/balm/badge.svg\n[cover-url]: https://coveralls.io/r/balmjs/balm\n[balm-cli-image]: https://img.shields.io/npm/v/balm-cli.svg\n[balm-cli-url]: https://npmjs.org/package/balm-cli\n[balm-ui-lite-image]: https://img.shields.io/npm/v/balm-ui-lite.svg\n[balm-ui-lite-url]: https://npmjs.org/package/balm-ui-lite\n[balm-ui-image]: https://img.shields.io/npm/v/balm-ui.svg\n[balm-ui-url]: https://npmjs.org/package/balm-ui\n[balm-scroll-image]: https://img.shields.io/npm/v/balm-scroll.svg\n[balm-scroll-url]: https://npmjs.org/package/balm-scroll\n[balm-ui-pro-image]: https://badge.fury.io/js/balm-ui-pro.svg\n[balm-ui-pro-url]: https://npmjs.org/package/balm-ui-pro\n[balm-git-flow-image]: https://badge.fury.io/js/balm-git-flow.svg\n[balm-git-flow-url]: https://npmjs.org/package/balm-git-flow\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbalmjs%2Fbalm","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbalmjs%2Fbalm","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbalmjs%2Fbalm/lists"}