( ( ( )
)\ ) ( ( ) )\ ) )\ ) ( /(
(()/( ( ( ( ( ( ( ) ( )\))( ' ( ( /( (()/((()/( )\())
/(_)))( ( )\))( )( ))\ ( ( )\ /(( ))\ ((_)()\ ) ))\ )\()) /(_))/(_))|((_)\
(_)) (()\ )\ ((_))\(()\ /((_))\ )\((_)(_))\ /((_) _(())\_)() /((_)((_)\ (_)) (_))_ |_ ((_)
| _ \ ((_) ((_) (()(_)((_)(_)) ((_)((_)(_)_)((_)(_)) \ \((_)/ /(_)) | |(_) / __| | \| |/ /
| _/| '_|/ _ \/ _` || '_|/ -_)(_-<(_-<| |\ V / / -_) \ \/\/ / / -_) | '_ \ \__ \ | |) | ' <
|_| |_| \___/\__, ||_| \___|/__//__/|_| \_/ \___| \_/\_/ \___| |_.__/ |___/ |___/ _|\_\
|___/
A set of components and utilities which make up the SDK for Progressive Web
You can find the latest version of the SDK Docs on DevCenter
Requirements
manage node and npm versions.
- Node ^10.17.0 or ^12.x
- npm ^5.7.1 or ^6.11.3
Install Dependencies
npm i
Usage
The Progressive Web SDK has a number of components that can be used in progressive web builds. Component documentation and examples can be seen by running our styleguide:npm run docs:dev
You can now view the styleguide at http://localhost:9000.
Our docs are built on styleguidist.
Use the SDK in a project
To use the progressive-web-sdk in a project, add it as a dev-dependency to your package.json. Once you have done that, runnpm install
.Components can now be imported into your project by loading the build files from
dist
:import Button from 'progressive-web-sdk/dist/components/button'
const myButton = <Button text="Take My Money!" />
If you are actively developing a new library or component in the SDK, run the following command in order for the files to be built into
dist
when making changes in src
:npm run dev:watch
Marking public API functions as experimental or deprecated
To mark a function as experimental or deprecated in code, you can use the utility functionsexperimental()
or deprecate()
from progressive-web-sdk/src/utils/warnings
within your experimental/deprecated function. This will prompt a warning in the browser whenever your function is used. You can add an additional custom message to the warning by passing a string into the first parameter.Example usage:
import {experimental} from './utils/warnings'
someExperimentalFunction() => {
// regular usage
experimental()
// the function implementation
}
This is the warning that will print in your browser:
[MOBIFY API WARNING]: You are currently using an experimental function: [someExperimentalFunction] This function may change at any time.
import {deprecate} from './utils/warnings'
someFunctionToBeDeprecated() => {
// with custom message
deprecate("It will be removed in version 1.2.3. Please use [newFunction] instead.")
// the function implementation
}
This is the warning that will print in your browser:
[MOBIFY API WARNING]: You are currently using an deprecated function: [someFunctionToBeDeprecated]. It will be removed in version 1.2.3. Please use [newFunction] instead.