{"id":13684498,"url":"https://github.com/webpack/react-starter","last_synced_at":"2025-10-02T08:30:56.773Z","repository":{"id":19237539,"uuid":"22472365","full_name":"webpack/react-starter","owner":"webpack","description":"[OUTDATED] Starter template for React with webpack. Doesn't focus on simplicity! NOT FOR BEGINNERS!","archived":true,"fork":false,"pushed_at":"2016-01-01T13:58:52.000Z","size":898,"stargazers_count":2207,"open_issues_count":32,"forks_count":320,"subscribers_count":62,"default_branch":"master","last_synced_at":"2024-10-30T00:58:48.705Z","etag":null,"topics":[],"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/webpack.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}},"created_at":"2014-07-31T14:34:24.000Z","updated_at":"2024-10-25T09:44:45.000Z","dependencies_parsed_at":"2022-08-01T03:37:56.883Z","dependency_job_id":null,"html_url":"https://github.com/webpack/react-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/webpack%2Freact-starter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webpack%2Freact-starter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webpack%2Freact-starter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webpack%2Freact-starter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/webpack","download_url":"https://codeload.github.com/webpack/react-starter/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":234820049,"owners_count":18891811,"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-08-02T14:00:34.196Z","updated_at":"2025-10-02T08:30:51.468Z","avatar_url":"https://github.com/webpack.png","language":"JavaScript","readme":"# webpack/react-starter\n\nStarter template for react and webpack.\n\n## Features\n\n* Compilation with webpack\n* React and jsx\n* react-router\n* Stylesheets can be CSS, LESS, SASS, Stylus or mixed\n* Embedded resources like images or fonts use DataUrls if appropriate\n* A simple flag loads a react component (and dependencies) on demand.\n* Development\n  * Development server\n  * Optionally Hot Module Replacement development server (LiveReload for Stylesheets and React components enabled)\n  * Uses SourceUrl for performance, but you may switch to SourceMaps easily\n* Production\n  * Server example for prerendering for React components\n  * Initial data inlined in page\n  * Long Term Caching through file hashes enabled\n  * Generate separate css file to avoid FOUC\n  * Minimized CSS and javascript\n* Also supports coffee-script files if you are more a coffee-script person.\n* You can also require markdown or text files for your content.\n\n## Local Installation\n\nInstall [node.js](https://nodejs.org) or [io.js](https://iojs.org)\n\nJust clone this repo and change the `origin` git remote.\n\n``` text\nnpm install\n```\n\n## Installation via Vagrant\n\nInstall [vagrant](https://vagrantup.com)\n\n``` text\nvagrant up\nvagrant ssh\ncd /vagrant\n```\n\n## Development server\n\n``` text\n# start the webpack-dev-server\nnpm run dev-server\n# wait for the first compilation is successful\n\n# in another terminal/console\n# start the node.js server in development mode\nnpm run start-dev\n\n# open this url in your browser\nhttp://localhost:8080/\n```\n\nThe configuration is `webpack-dev-server.config.js`.\n\nIt automatically recompiles and refreshes the page when files are changed.\n\nAlso check the [webpack-dev-server documentation](http://webpack.github.io/docs/webpack-dev-server.html).\n\n\n## Hot Module Replacement development server\n\n``` text\n# start the webpack-dev-server in HMR mode\nnpm run hot-dev-server\n# wait for the first compilation is successful\n\n# in another terminal/console\n# start the node.js server in development mode\nnpm run start-dev\n\n# open this url in your browser\nhttp://localhost:8080/\n```\n\nThe configuration is `webpack-hot-dev-server.config.js`.\n\nIt automatically recompiles when files are changed. When a hot-replacement-enabled file is changed (i. e. stylesheets or React components) the module is hot-replaced. If Hot Replacement is not possible the page is refreshed.\n\nHot Module Replacement has a performance impact on compilation.\n\n\n## Production compilation and server\n\n``` text\n# build the client bundle and the prerendering bundle\nnpm run build\n\n# start the node.js server in production mode\nnpm run start\n\n# open this url in your browser\nhttp://localhost:8080/\n```\n\nThe configuration is `webpack-production.config.js`.\n\nThe server is at `lib/server.js`\n\nThe production setting builds two configurations: one for the client (`build/public`) and one for the serverside prerendering (`build/prerender`).\n\n\n## Legacy static assets\n\nAssets in `public` are also served.\n\n\n## Build visualization\n\nAfter a production build you may want to visualize your modules and chunks tree.\n\nUse the [analyse tool](http://webpack.github.io/analyse/) with the file at `build/stats.json`.\n\n\n## Loaders and file types\n\nMany file types are preconfigured, but not every loader is installed. If you get an error like `Cannot find module \"xxx-loader\"`, you'll need to install the loader with `npm install xxx-loader --save` and restart the compilation.\n\n\n## Common changes to the configuration\n\n### Add more entry points\n\n(for a multi page app)\n\n1. Add an entry point to `make-webpack-config.js` (`var entry`).\n2. Add a new top-level react component in `app` (`xxxRoutes.js`, `xxxStoreDescriptions.js`, `xxxStores.js`).\n3. (Optional) Enable `commonsChunk` in `webpack-production.config.js` and add `\u003cscript src=\"COMMONS_URL\"\u003e\u003c/script\u003e` to `app/prerender.html`.\n4. Modify the server code to require, serve and prerender the other entry point.\n5. Restart compilation.\n\n### Switch devtool to SourceMaps\n\nChange `devtool` property in `webpack-dev-server.config.js` and `webpack-hot-dev-server.config.js` to `\"source-map\"` (better module names) or `\"eval-source-map\"` (faster compilation).\n\nSourceMaps have a performance impact on compilation.\n\n### Enable SourceMaps in production\n\n1. Uncomment the `devtool` line in `webpack-production.config.js`.\n2. Make sure that the folder `build\\public\\debugging` is access controlled, i. e. by password.\n\nSourceMaps have a performance impact on compilation.\n\nSourceMaps contains your unminimized source code, so you need to restrict access to `build\\public\\debugging`.\n\n### Coffeescript\n\nCoffeescript is not installed/enabled by default to not disturb non-coffee developer, but you can install it easily:\n\n1. `npm install coffee-redux-loader --save`\n2. In `make-webpack-config.js` add `\".coffee\"` to the `var extensions = ...` line.\n\n\n## License\n\nCopyright (c) 2012-2015 Tobias Koppers [![Gittip donate button](http://img.shields.io/gittip/sokra.png)](https://www.gittip.com/sokra/)\n\nMIT (http://www.opensource.org/licenses/mit-license.php)\n","funding_links":[],"categories":["Awesome React","JavaScript","React"],"sub_categories":["Tools"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwebpack%2Freact-starter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwebpack%2Freact-starter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwebpack%2Freact-starter/lists"}