{"id":18512716,"url":"https://github.com/visual-framework/vf-build-boilerplate","last_synced_at":"2025-05-14T12:14:35.075Z","repository":{"id":46025927,"uuid":"212873736","full_name":"visual-framework/vf-build-boilerplate","owner":"visual-framework","description":"Convert VF components to static CSS and JS to pair with your existing application or site.","archived":false,"fork":false,"pushed_at":"2025-04-27T03:30:11.000Z","size":4274,"stargazers_count":0,"open_issues_count":11,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-27T04:26:10.286Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/visual-framework.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"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,"zenodo":null}},"created_at":"2019-10-04T17:58:07.000Z","updated_at":"2021-11-19T12:02:45.000Z","dependencies_parsed_at":"2024-05-02T12:50:55.969Z","dependency_job_id":"86a56fd8-657a-458c-a236-6dd38c78e887","html_url":"https://github.com/visual-framework/vf-build-boilerplate","commit_stats":null,"previous_names":[],"tags_count":0,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/visual-framework%2Fvf-build-boilerplate","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/visual-framework%2Fvf-build-boilerplate/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/visual-framework%2Fvf-build-boilerplate/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/visual-framework%2Fvf-build-boilerplate/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/visual-framework","download_url":"https://codeload.github.com/visual-framework/vf-build-boilerplate/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254140772,"owners_count":22021222,"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":[],"created_at":"2024-11-06T15:35:10.491Z","updated_at":"2025-05-14T12:14:35.025Z","avatar_url":"https://github.com/visual-framework.png","language":"JavaScript","readme":"# VF Build Boilerplate\n\nA minimal implementation to build VF 2.0 components into static CSS and JS to pair with your existing application or site.\n\n\u003e Looking for other ways to use Visual Framework 2.0 components?\n\u003e [See the guide](https://visual-framework.github.io/vf-welcome/building/)\n\n## Creating a new project powered by vf-build-boilerplate\n\nThere are two methods you can use:\n\n1. Use the interactive yarn template [RECOMMENDED]\n    - If you don't have npm, [install it](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm)\n    - The [`create-vf-project`](https://github.com/visual-framework/create-vf-project) allows you to interactively create a new site by typing\u003cbr/\u003e `yarn create @visual-framework/vf-project your-new-site-name vf-build-boilerplate`\n    - Follow the prompts\n1. The GitHub template\n    - Click the \"[Use this template](https://help.github.com/en/articles/creating-a-repository-from-a-template)\" method; quick url: https://github.com/visual-framework/vf-build-boilerplate/generate\n    - Follow the prompts and then clone the new project to your local machine\n\n## Configuring the build\n\n- In `package.json` update `vfConfig`\n- If you need any ad hoc CSS and JS, add it in `./src/components/vf-local-overrides`\n\nOtherwise configure gulp like any other project.\n\n## Building assets, developing \n\n1. You'll need to [install npm](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm)\n1. If you don't have `yarn`, install it\n   - https://yarnpkg.com/lang/en/docs/install/\n1. Install all the things\n   - `yarn install`\n1. Generate the site in `/build`\n   - `gulp dev` renders and serves\n   - `gulp build` build static assets\n\n### Adding Visual Framework components\n\nTo add a component, use the command line or install it manually.\n\n- by package: `yarn add @visual-framework/vf-logo`\n    - updating components: `yarn upgrade-interactive --latest` (alias: `yarn run update-components`)\n- Manual installation for customisation\n    - Download a pattern\n    - Copy it to `./src/components/vf-component-name`\n- Create your own local component\n    - You can add a custom VF-compatible component to `./src/components` and use it in your site.\n    - `yarn add vf-component-generator --dev`\n    - `gulp vf-component`\n\n## Troubleshooting\n\nHaving problems? See https://visual-framework.github.io/vf-welcome/troubleshooting/\n\n## Footnotes\n\n- Why `yarn` and not `npm`?\n  For the particular structure of the Visual Framework components, Yarn is considerably\n  faster at installing and does so more efficiently (about half the total file size). You'll\n  also be able to use `yarn upgrade-interactive --latest`, which makes it easier to update\n  VF components.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvisual-framework%2Fvf-build-boilerplate","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvisual-framework%2Fvf-build-boilerplate","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvisual-framework%2Fvf-build-boilerplate/lists"}