1. Upgrade global configuration

1. Update the CLI

$ npm i -g @tarojs/cli@next
Copy the code

Confirm CLI upgrade success, as shown in the following figure:

Ii. Upgrade of project configuration

$ npm i @tarojs/runtime@next @tarojs/mini-runner@next @tarojs/components@next @tarojs/taro@next $ npm i react @tarojs/react@next # React $NPM I nervjs #Copy the code

If using taro-UI, upgrade to 3.0.0-alpha.3

$ npm i taro-ui@next
Copy the code

The dependency comparison between the upgraded configuration file and the previous configuration file is as follows:

The config/index.js file in the root directory has been modified as follows:

PS: It is recommended to create a new TARO3 project for comparison and upgrade

Iii. Upgrade the project entry file (app.*)

The config attribute in app.tsx needs to be taken out and a separate.config.js file with the same name is created, as is the case with other project pages, as you can see below. Some of the introductions in app.tsx need to be changed, as do other project pages, as you’ll see below.

Other changes:

1. Introduction of Providers

// import { Provider } from '@tarojs/mobx'; Import {Provider} from 'mobx-react';Copy the code

2, render function content adjustment

Iv. Content modification of the page

1. Dependency introduction and modification

Before the changeThe modified

2. The config property of the file needs to be taken out and a separate.config.js file with the same name needs to be created. The content structure is roughly as follows:

Const config = {navigationBarTitleText: '* * * * merchant side, navigationBarBackgroundColor: f7dff' # 1 ', navigationBarTextStyle: 'white' }; export default config;Copy the code

3. Route modification

Other found problems

1. Get changes to global data

2. If the preview or upload volume is too large, you can enable compression at the same time. At this time, hot update is slow. (wechat mini program)

"fat": "export CODE_ENV=fat; NODE_ENV=production npm run pre:build -- --watch",Copy the code

5. Modification of some components

Six, reference

1, Taro official upgrade documents

2, code magic change division