Pri Ā·
Pri is a toolkit for building web applications with React. Helps you deal with everything with develop, so you can focus on the business logic.
Features
Pri can help you develop project and component.
- š± Auto router. File-based routing out of the box.
- š Mdx support. Write markdown page easily, just create a file using
.md
or .mdx
as suffixes. - š Static export. Very easy to deploy to github pages.
- š¢ Mocks. Using service worker to mock request!
- š WebUI. You can create page, or config files by click button in webui!
- š Dynamic Import. Automatic page level dynamic routing.
- š„ Typescript. 100% typescript source code, for project maintainability considerations, only TS projects are supported!
- šļø Configuration file auto creator. Never worry about configuration files and updates of configuration files. This is automatic.
- š Auto dll. Speed up hot loader.
- š Pluginable. 20+ built-in plugins, and more community plug-ins.
- 0ļøā£ Zero-config.
see Docs
Using pri
Pri is used as a npm package installed in your project.
# 1. Create an empty folder, install pri locally.
$ npm i pri --save
# 2. Init project files, and you will have following npm scripts.
$ npx pri init
# Start dev server
$ npm start
# Start docs server
$ npm run docs
# Build
$ npm run build
# Test
$ npm test
Read more npm scripts.
# Preview of production environment
$ npm run preview
# See bundle size analyse
$ npm run analyse
# Bundle to one file
$ npm run bundle
# Format all sources code
$ npm run format
Using pri plugin
Installing the pri plugin into the project will take effect.
For example, using pri-plugin-dob:
npm i pri-plugin-dob --save
# Now all plugin works
npm start
File Structure
Project:
.
āāā .temp # Gitignored. Temporary file folder.
āāā coverage # Gitignored. Code coverage folder.
āāā dist # Gitignored. Dist folder, auto generated by `npm run build`.
āāā tests # Tests folder.
āāā src # Source files folder.
ā āāā pages # Page files.
ā āāā layouts # Layout files.
ā āāā components # Component files.
ā āāā utils # Util files.
āāā priconfig.json # Config file.
āāā ...other-files # Auto generated by `npx pri init`.
Component:
.
āāā .temp # Gitignored. Temporary file folder.
āāā coverage # Gitignored. Code coverage folder.
āāā dist # Gitignored. Dist folder, auto generated by `npm run build`.
āāā tests # Tests folder.
āāā src # Source files folder. Anything here.
āāā priconfig.json # Config file.
āāā ...other-files # Auto generated by `npx pri init`.
Inspired
Q&A
Using in windows
fedora. Using windows subsystem for Linux.
Migrate from 0.x/1.x to 2.x
Two steps:
- Run
npx pri-migrate-one-to-two
in your project root path. - Reinstall node_modules.