Package included simple app example, webpack dev server with riot hot reload and less, sass, stylus support. ES6 features available too. Jest with riot support for testing. ES6 and eslint in riot tag.
Just read https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md but replace all "react" word to "riot" :)
- Automove critical css to head
- Hot .tag reload
- Realtime code linting
- Async/await (ES2017).
- Exponentiation Operator (ES2016).
- Object Rest/Spread Properties (stage 3 proposal).
- Dynamic import() (stage 3 proposal)
- Jest for .tag testing
- Generate all favicons and manifest.json
- Pre-commit testing
⚡ Start dev-server
git clone --depth=1 https://github.com/alexstep/create-riot-dapp my-riot-dapp cd my-riot-dapp rm -rf .git
npm install npm start
go to http://localhost:9999
Riot route base url set in ./src/view/app.view.js line 47
✔ Testing and linting
Package included Jest, for testing riot tags. See riot tag test example
npm test npm test -- --coverage npm run coverage #also npm run eslint npm run lesslint
read more about testing
Add flow type checker.
npm install flow-bin npm run flow
Write in head your js files
//@flow weak to enable flow checker
⚛ Favicons and meta-information
Edit "meta" section in package.json (see manifest format description) Put your app icon in ./src/favicon_source.png and run
npm run favicons
manifest.json , browserconfig.xml, favicons and other meta-files will be generated and put to ./public/static/meta/ folder.
Also you can change some options in ./scripts/config/favicons.config.js
⚗ Build for production
npm run build
Check build result
npm run check_build
npm run deploy
Publish ./build folder to IPFS by defaults.
For example you can deploy app to firebase
npm install -g firebase-tools firebase login firebase init firebase deploy
Change settings in scripts/ssh_deploy.js Add this file to .gitignore
npm i -D ssh-deploy-release npm run ssh_deploy
Read more about deploy
⚙ Configuration options
.env file in the root of the generated project, and add any of the configuration options below
The generated project comes with LESS support by default, but you can add SASS or Stylus at any time by edit the options from the
enable_less=true- enable LESS support
enable_sass=true- enable SASS support
enable_stylus=true- enable Stylus support
HTTPS=true- enable https in localhost
PORT=9999- change port
OPEN_BROWSER=false- don't open browser after running webpack server
Read more about .env files
Tabs or Spaces?
You can change codestyle rules in .eslintrc.js and run
npm run eslint_fix for format all files
Fork and send pull-request. Thank you!