This blog introduces the development process of rancher/ UI, a supporting front-end project for Rancher

Clone the project locally
git clone https://github.com/rancher/ui.git

Go to the project root directory
cd ui

Use NPM I to install project dependencies
./scripts/update-dependencies

# Start the local development environment
yarn start

Copy the code

Note that since the front and back ends are separated, you can’t just start the front end project, but also have the back end service

Configure the back-end address here and you can access it normallyNote that it must be HTTPS

Deploy using the following command

The server address is the server address after front-end deployment

./scripts/build-static -l -s -c 'Server address'
Copy the code

Front-end deployment requires cross-domain support,

-l Indicates the latest

-s Indicates that the test is skipped

-c Server access address

After compiling, upload /static/latest2 to the server and make sure it is accessible. 404 is normal because there is no link to the back end

Log in to Rancher

Open the /v3/ Settings/UI-index interface of your Rancher server,

For example, https://rancher server /v3/ Settings/UI-index

And modify and fill the front-end access address into the value input box and save upload