How to setup UI environment

Creating a new development setup for Stripes

This setup is based on the usage of stripes-cli and the concept of workspaces which are available in yarn:

Make sure yarn and npm are configured to the folio packages:

yarn config set @folio:registry https://repository.folio.org/repository/npm-folioci/

npm config set @folio:registry https://repository.folio.org/repository/npm-folioci/

Install stripes-cli globally:
```
yarn global add @folio/stripes-cli
```
Create a new workspace (chose modules you want to have locally and make developing on them). Make sure to choose stripes-sample-platform, where the configuration of modules should be done.
```
stripes workspace
```
Pick the bare minimum modules below or custom ones

- stripes-sample-platform
- ui-users

The above will create a stripes directory.
Navigate to stripes/stripes-sample-platform. Make sure to rename .stripesclirc.example to .stripesclirc or just create new .stripesclirc file and make sure it contains the following:
```
{
  "okapi": "http://localhost:9130",
  "tenant": "diku",
  "configFile": "stripes.config.js",
  "port": 8080
}
```
Also, make sure the package.json has the following set of dependencies. Make sure to keep dependencies up to date with what is run on folio environments like folio-testing.
```
  "dependencies": {
    "@folio/stripes": "^2.7.3",
    "react": "~16.6.0",
    "react-dom": "~16.6.0",
    "react-redux": "~5.1.1",
    "react-router-dom": "^5.0.1",
    "redux": "~3.7.2"
  }
```

Now it is possible to run the platform from stripes/stripes-sample-platform folder with the command below. Make sure okapi (okapi property in .stripesclirc) backend is up. It could be a local environment or one of the remote environments.

stripes serve // when server runs locally
stripes serve --okapi <okapiURL> // override okapi value from .stripesclirc when server is not locally set up.
                                 // The --okapi part can be ommited if the okapi url is changed in .stripesclirc to what it really should be.

At this moment the UI development server is up and can be accessible on https://localhost:8080. Credentials are diku_admin/admin.

Further steps which are not required for the initial setup

Over time there is a need to update the packages to use the latest ones. To update workspace modules run the following command from the stripes folder in the root of the workspace:
```
stripes platform pull
```
After that run the following command to install dependencies:
```
stripes platform install
```

To remove the outcome of the install command run:

stripes platform clean
rm -rf yarn.lock // search for similar command if Windows OS is used

How to setup UI environment

Creating a new development setup for Stripes

Further steps which are not required for the initial setup

Связанные статьи