UmiJSUmiJS
  • Introduce
  • Guide
  • API
  • Umi Max
  • Blog
⌘ K
中文
Getting Started
Development Environment
Directory Structure
Routing
Plugins
Mock
Proxy
Styles
Route Data Loading
TypeScript
Environment Variables
Scaffolding
Micro Generators
Coding Standards
Debugging
Testing
Plugin Development
Using Vue
MPA Mode
MFSU
Last updated:
Open-source MIT Licensed | Copyright © 2017-present

TABLE OF CONTENTS

Development Environment

This article will guide you through setting up a local development environment for an Umi.js project from scratch.

Nodejs

Umi.js development requires Node.js, so please ensure that Node.js is installed on your computer and its version is above 18.

💡

If you are a macOS user, it is recommended to use nvm to manage the versions of Node.js; Windows users are recommended to use nvm-windows.

This article will use nvm to install Node.js on macOS or Linux environments:

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash
nvm -v
0.39.1

After installing nvm, use the following commands to install Node.js:

nvm install 18
nvm use 18

After the installation is complete, use the following commands to check if the installation was successful and the correct version was installed:

node -v
v18.14.0

Dependency Management

After installing Node, the npm dependency management tool comes with it, but Umi.js recommends using pnpm for dependency management:

curl -fsSL https://get.pnpm.io/install.sh | sh -

After the installation is complete, you can use the following command to check if the installation was successful:

pnpm -v
7.3.0

IDE

After installing Node.js and pnpm (or another dependency management tool), you need to choose an IDE or text editor you are comfortable with to write code. If you don't have a preferred IDE yet, you can choose one from the list below:

  1. Visual Studio Code (Recommended)
  2. WebStorm (Recommended)
  3. IntelliJ IDEA
  4. Sublime Text
  5. Atom

Next Steps

Congratulations! Your local environment is now ready to start developing Umi.js projects. Go to boilerplate to learn how to quickly start a project with the Umi.js scaffold! 🎉