Using the create-react-app + Hbuilder project packaged into apk file

First, the global installed create-react-app

# 全局安装
npm install -g create-react-app
# 构建一个my-app的项目
npx create-react-app my-app
cd my-app

# 启动编译当前的React项目,并自动打开 http://localhost:3000/
npm start

The project is packaged compilation

yarn build

After packing compile, build file folder to get compiled, we can pull out of this folder, run into Hbuilder editor index.html page inside the folder, because Hbuilder editor has built-in server, if then open a blank page, perhaps the root path configuration error, the solution is to open the original project, open package.json file, modify the configuration homepage add
Here Insert Picture Description
repackaged compilation after the configuration is over, perform yarn build, and then re-open the index compiled, if normal display it to the next step.

Open Hbuilder Editor File> New> Mobile app> select an empty template on the line
Here Insert Picture Description

After creating a mobile app, and then the file before the package compiled build folder inside all into this mobile app folder (if that comes with some empty folders you do not need and can be put inside some empty folders deleted )

When you are ready, and then select the mobile app project, click on the above issue Hbuilder Editor menu> Cloud Packaging - Packaging native installation package

Here Insert Picture Description

Select Android, then click on the package, (if packed button appears as disabled, the gray state, it should be the manifest.json file is not configured, follow the prompts to configure)

After clicking the image above package, Hbuilder in the cloud will generate a apk file, etc. After the system generates over, directly download the apk file generated after completion, and then installed on Android phone can be.

Published 22 original articles · won praise 6 · views 10000 +

Guess you like

Origin blog.csdn.net/qq_39024012/article/details/100301119