{"id":15170815,"url":"https://github.com/mrtimofey/vue-ssr-starter","last_synced_at":"2025-10-01T05:30:55.163Z","repository":{"id":89635509,"uuid":"83370529","full_name":"mrTimofey/vue-ssr-starter","owner":"mrTimofey","description":"Starter kit for projects with Webpack 4, Vue 2 and SSR","archived":true,"fork":false,"pushed_at":"2020-12-30T09:58:31.000Z","size":259,"stargazers_count":53,"open_issues_count":1,"forks_count":15,"subscribers_count":5,"default_branch":"master","last_synced_at":"2024-10-01T06:35:21.826Z","etag":null,"topics":["axios","buble","pug","server-side-rendering","ssr","stylus","svg-sprites","vue","vue-router","vuex","webpack"],"latest_commit_sha":null,"homepage":"","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/mrTimofey.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}},"created_at":"2017-02-28T00:17:16.000Z","updated_at":"2024-02-14T14:30:39.000Z","dependencies_parsed_at":null,"dependency_job_id":"1e53a463-82a8-4b18-98fd-502ff0bddbc3","html_url":"https://github.com/mrTimofey/vue-ssr-starter","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/mrTimofey%2Fvue-ssr-starter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrTimofey%2Fvue-ssr-starter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrTimofey%2Fvue-ssr-starter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mrTimofey%2Fvue-ssr-starter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mrTimofey","download_url":"https://codeload.github.com/mrTimofey/vue-ssr-starter/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":234827057,"owners_count":18892884,"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":["axios","buble","pug","server-side-rendering","ssr","stylus","svg-sprites","vue","vue-router","vuex","webpack"],"created_at":"2024-09-27T08:23:20.168Z","updated_at":"2025-10-01T05:30:54.749Z","avatar_url":"https://github.com/mrTimofey.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Webpack, Vue, SSR project template\n\nIncludes:\n\n* Webpack 4\n* [polka](https://github.com/lukeed/polka) web-server\n* Vue 2 with SSR, Vuex and vue-loader\n* Stylus with [kouto-swiss](http://kouto-swiss.io/)\n* Axios\n* Pug\n* SVG sprites builder\n* ESlint with pre-push hook\n\n## Getting started\n\n```bash\nnpm i\n\n# development server on localhost:8080\nnpm run dev\n\n# production build\nnpm run build\n\n# production server on localhost:8080\nnpm start\n```\n\n## Configuration\n\n`.env.dev` contains environment variables used for local development. You can change application port,\nAPI base URL for server and client and enable/disable proxy (http-proxy-middleware).\n\nFor production builds you should provide same environment variables yourself.\nAlternatively you can use `.env` after these steps:\n1. Move `dotenv` from `devDependencies` to `dependencies`.\n2. Create `.env` file with production config.\n3. Run `npm start` or `NODE_ENV=production node -r dotenv/config index`.\n\n## API proxy\n\nSee `setup-proxy.js` for description.\n\n## Application structure\n\n* `index.js` - application server\n* `setup-proxy.js` - `http-proxy-middleware` setup\n* `build/` - build related code\n\t* `setup-dev-server` - development server setup\n\t* `svg-sprite` - svg sprite generation script, gathers icons from `src/assets/svg-icons` and compiles them into `src/assets/sprite.svg`\n\t* `webpack/` - webpack config, `base` - common, `server` for server with SSR, `client` for browser\n* `dist/` - production build files\n* `src/`\n\t* `assets/` - application static assets (images, fonts, icons etc.)\n\t\t* `sprite.svg` - generated sprites file, `require('src/assets/sprite.svg')` will return file contents string\n\t\t* `fonts/` - guess what\n\t\t* `images/` - static images (backgrounds, patterns etc.)\n\t\t* `svg-icons/` - contains SVG icons for the sprite\n\t* `entry/` - main entry points\n\t\t* `app` - shared between server and client, exports a factory function returning root component instance, mixes it with `app.vue`\n\t\t* `client` - client entry\n\t\t* `server` - server entry\n\t* `components/` - vue components\n\t* `pages/` - components here are implicitly attached to routes same with componets\\' file names\n\t\t(excluding leading `_` in file or folder names and `404.vue` which will be used as a catch-all route)\n\t* `filters/` - vue filters registered implicitly via `Vue.filter()`\n\t* `directives/` - vue directives registered implicitly via `Vue.directive()`\n\t* `store/` - Vuex storage, `index` returns a factory function returning configured Vuex store instance\n\t* `utils/` - common utility functions\n\t\t* `index` - common utility functions\n\t\t* `ssr` - SSR related functions and mixins\n\t* `app.vue` - application root component, implicitly mixed with `entry\\app`\n\t* `http` - exports http client instance (Axios)\n\t* `layout.pug` - application HTML layout\n\t* `router` - exports a factory function returning vue-router instance\n\t* `shared.styl` - globally included stylus file (for variables, mixins, etc.)\n\n## SSR related component features\n\nEvery component within `src/pages` directory can use some special features providing full SSR support:\n\n* `component.routePath`, String - additional route suffix. Usually used to provide dynamic route segments.\n\tYou can use any string allowed for the vue-router path definition. All dynamic segments are automatically mapped\n\tto component `props`.\n* `component.routeMeta`, Object - `route.meta`. Include `statusCode` here to modify an HTTP status returned with SSR.\n\t404 route includes 404 status code by default.\n* `component.prefetch({ store, props, route })`, function\n\t(`store` - vuex store instance, `props` - route params, `route` - current route object).\n\n\tMust return a promise. Allows some async routine before actual application rendering on server side.\n\tTo pass any data to component: resolve promise with needed data and add corresponding `component.data` fields with\n\ttheir initial values to prevent *...property or method not defined...* error.\n\tAutomatically called on client side from `beforeMount` and `beforeRouteChange` hooks as well.\n\tSee `src/utils/ssr` mixin.\n* Boolean `prefetching` data field indicates when prefetch is running.\n\n\t**IMPORTANT: there is no component context within `prefetch` function because component instance is not created yet! That means you should not try to use `this`.**\n\n`prefetch` also works on the root component (`src/app.vue`) with some restrictions:\n\n* no way to pass component data (only store can be affected).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmrtimofey%2Fvue-ssr-starter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmrtimofey%2Fvue-ssr-starter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmrtimofey%2Fvue-ssr-starter/lists"}