Development Toolkit for React Veterans
# install & initialize new appnpm install -g dev-toolkitdev-toolkit --init my_appcd my_app
# run it via npm scriptsnpm run dev# or run it directly (-w or --watch)dev-toolkit --watch
This will give you the following structure to work with:
src├── client│ ├── app.js│ └── ...└── server└── ...
# Create `build`-folder with compiled files (-b or --build)dev-toolkit --build
Verify if static build is working correctly.
# Runs a minimal server that serves the build folder (--static or --serve-static)dev-toolkit --serve-static
To make use of dynamic pages and components for making your app load faster use the extended build command.
For advanced users only, refer to this gist for information on how to implement it.
# This will create an index-file for each dynamic route (-d --dynamic or --build --dynamic)dev-toolkit --build --dynamic
script-link to the
appbundle and the page-bundle
defer-attributes as appropriate
You'll need to import the webpack config for running tests, refer to this gist for the setup. You'll be able to write your tests in ES2015, just like the rest of your app. Single tests can also be run in a watch-mode with the
npm run test-single-command.
You can use your project as an universal/isomorphic server-side-rendered app.
For advanced users only.
# Compile and run `src/server/app` (-s or --serve)dev-toolkit --serve
# Check Version (-v or --version)dev-toolkit -v
// in your package.json, add `toolkitSettings` section"toolkitSettings":"vendor":"react""react-dom""react-router"
last tested version 5.10.1
last tested version 3.8.3
The package doesn't know that we're using webpack via the dev-toolkit and since webpack is not present in the dependencies, it throws an
UNMET PEER DEPENDENCY-warning.
dev-toolkit-package is not part of the dependencies of the starting point I created with
Since you already installed
dev-toolkit globally, it would be easier to work on multiple projects without reinstalling the
dev-toolkit-dependencies for each project. This way when you update the toolkit with
npm install -g dev-toolkit@version, all your projects are updated as well.
You can of course still pin your project with a specific version of the toolkit by running
npm install --save-dev dev-toolkit inside your project folder.
Fancy working on the toolkit itself? Check out the Contributing Guidelines.
kindly supported by BrowserStack.