{"id":15366421,"url":"https://github.com/jasonboy/vue-web-kit","last_synced_at":"2025-10-03T22:03:22.242Z","repository":{"id":31165172,"uuid":"122691066","full_name":"JasonBoy/vue-web-kit","owner":"JasonBoy","description":"🚀A Modern, Production-Ready, and Full-Stack Node Web Framework with Vue.js","archived":false,"fork":false,"pushed_at":"2022-12-09T10:11:28.000Z","size":4804,"stargazers_count":11,"open_issues_count":27,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-02-23T09:51:20.846Z","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":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/JasonBoy.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":"2018-02-24T01:35:02.000Z","updated_at":"2023-03-04T06:05:21.000Z","dependencies_parsed_at":"2023-01-14T18:28:22.893Z","dependency_job_id":null,"html_url":"https://github.com/JasonBoy/vue-web-kit","commit_stats":null,"previous_names":[],"tags_count":9,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JasonBoy%2Fvue-web-kit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JasonBoy%2Fvue-web-kit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JasonBoy%2Fvue-web-kit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/JasonBoy%2Fvue-web-kit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/JasonBoy","download_url":"https://codeload.github.com/JasonBoy/vue-web-kit/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241018426,"owners_count":19895075,"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-10-01T13:18:44.478Z","updated_at":"2025-10-03T22:03:22.149Z","avatar_url":"https://github.com/JasonBoy.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# vue-web-kit\n\n[![Building Status](https://travis-ci.org/JasonBoy/vue-web-kit.svg?branch=master)](https://travis-ci.org/JasonBoy/vue-web-kit)\n[![Dependency Status](https://david-dm.org/JasonBoy/vue-web-kit.svg)](https://david-dm.org/JasonBoy/vue-web-kit)\n[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)\n\n🚀A Modern, Production-Ready, and Full-Stack Node Web Framework with Vue.js\n\u003e This framework is based on [koa-web-kit](https://github.com/JasonBoy/koa-web-kit) with Vue.js as a main UI library\n\n## Features\n\n- ✨Built with all modern frameworks and libs, including Koa2, Vue.js, Bootstrap-v4, Webpack, ES6, Babel...\n- 📦Get all the Node.JS full stack development experience out of the box\n- 🔥Hot Module Replacement support without refreshing whole page, and bundle size analyzer support\n- 📉Async/Await support for writing neat async code\n- 💖SASS preprocessor, PostCSS, autoprefixer for better css compatibility\n- 🎉Simple API Proxy bundled, no complex extra nginx configuration\n- 🌈Available for generating static react site\n- ⚡️Just one npm command to deploy your app to production\n- 👷Continuously Maintaining🍻\n\n### Quick Start\n\nClone or download the repo, and go to your project root,\n\n\u003e Before start, recommend to copy the `config/app-config.js.sample` to `../app-config.js`(or `config/app-config.js` in same dir) for local dev configuration\n\n1. Install Dependencies\n\n```bash\nnpm install\n```\n\n2. Start Dev Server\n\n`npm run dev` to start koa with HMR enabled\n\n3. Go to `http://localhost:3000` to view the default page\n\n### Project Structure\n\n- `api` dir, the API Proxy utility, also put your api urls here for universal import across your app\n- `config` dir, all webpack build configs are put here, besides, some application-wide env configs getter utility\n- `mw` dir, some middleware here, default logger utility also located here\n- `routes` dir, put your koa app routes here\n- `src` dir, all your front-end assets, react components, services, etc...\n- `utils` dir, utilities for both node.js and front-end\n- `views` dir, your view templates\n- *`build`* dir, all built assets for your project, git ignored\n- *`logs`* dir, logs are put here by default, git ignored\n- All other files in project root, which indicate their purposes clearly😀.\n\n### Application Config and Environment Variables\n\nEvery project has some configuration or environment variables to make it run differently in different environment,\nfor vue-web-kit, we also provide different ways to configure your ENVs.\n\n#### app-config.js/app-config.js.sample\n\nThe pre bundled file `app-config.js.sample` in `config` dir lists some common variables to use in the project, you should copy and rename it to `app-config.js` for your local config:\n```javascript\nmodule.exports = {\n  //http server listen port\n  \"PORT\": 3000,\n  //most commonly used env\n  \"NODE_ENV\": \"development\",\n  //enable/disable built-in API Proxy\n  \"NODE_PROXY\": true,\n  //config the api proxy debug level, [0, 1, 2], 0 -\u003e nothing, default: 1 -\u003e simple, 2 -\u003e verbose\n  \"PROXY_DEBUG_LEVEL\": 1,\n  //static endpoint, e.g CDN for your static assets\n  \"STATIC_ENDPOINT\": \"\",\n  //add a alternative prefix for your \"STATIC_ENDPOINT\"\n  \"STATIC_PREFIX\": \"\",\n  //add \"/\" to the end of your static url, if not existed\n  \"PREFIX_TRAILING_SLASH\": true,\n  //global prefix for your routes, e.g http://a.com/prefix/...your app routes,\n  //like a github project site\n  \"APP_PREFIX\": \"\",\n  //API Proxies for multiple api endpoints with different prefix in router\n  \"API_ENDPOINTS\": {\n    //set a default prefix\n    \"defaultPrefix\": \"/prefix\",\n    //e.g http://127.0.0.1:3000/prefix/api/login --\u003eproxy to--\u003e http://127.0.0.1:3001/api/login\n    \"/prefix\": \"http://127.0.0.1:3001\",\n    \"/prefix2\": \"http://127.0.0.1:3002\",\n  }\n}\n```\n\n#### Environment Variables\n\nAll the variables in config.json can be set with Environment Variables, which have higher priority than `app-config.js`.\ne.g:\n`\u003e NODE_ENV=production npm start`\nor\n```bash\nexport PORT=3001\nexport NODE_ENV=production\nnpm start\n```\nBTW you can do Everything you can within cli to set your env.\n\n#### Default `config.default/dev(prod).js` in source code\n\nThe project comes with default config files just like `config.json`, which will be used if neither above are provided.\n\n\u003e Priority: *Environment Variables* \u003e *app-config.js* \u003e *default config.default./dev(prod).js*\n\n### Template Engines\n__Default template engine is [nunjucks](https://github.com/mozilla/nunjucks)__,\nSince we are using the [consolidate.js](https://github.com/tj/consolidate.js), you can use any template engine you want.\n\n### Logs\nThe builtin `mw/logger.js` provides some default log functionality for your app, it uses [winston](https://github.com/winstonjs/winston) for async log. You can add more `transport`s for different level logging.\n\n### Production Deployment\n\nDeploy your app to production is extremely simple with only one npm script command, you can provide different options in different deployment phases(e.g: install, build, start server),\n[pm2](https://github.com/Unitech/pm2) inside is used as node process manager.\n\u003e Global installation of PM2 is not required now, we will use the locally installed pm2.\n\n\n#### Usage\n\n`npm run deploy -- skipInstall skipBuild skipServer`\nThe last three options are boolean values in `0`(or empty, false) and `1`(true).\n\n#### Examples:\n\n- `npm run deploy`: no options provided, defaults do the tasks.\n- `npm run deploy -- 1`: this will skip the `npm install --no-shrinkwrap`, and just go to build and start server.\n- `npm run deploy -- 1 0 1`: which will only build your assets\n- `npm run deploy -- 1 1 0`: which will just start node server, useful when all assets were built on a different machine.\n\n\u003e You may need to create/update the script to meet your own needs.\n\n### License\n\nMIT @ 2016-present [jason](http://blog.lovemily.me)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjasonboy%2Fvue-web-kit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjasonboy%2Fvue-web-kit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjasonboy%2Fvue-web-kit/lists"}