RiotJS startkit, based on create-react-app and react-scripts.

DEMO

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

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

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

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

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

About tool

Read more about deploy

Modify the .env file in the root of the generated project, and add any of the configuration options below 👇 to enable that feature.

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 .env file.

• 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

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!