[Taro Introduction: 1] Environment preparation and project initialization

1. Directory structure

├ ─ ─ dist directory compiled results ├ ─ ─ the config configuration directory | ├ ─ ─ dev. The development of a js configuration | ├ ─ ─ index. The default configuration | js └ ─ ─ the prod. Js packaging configuration ├ ─ ─ the SRC source directory | ├ ─ ─ pages Page file directory | | ├ ─ ─ index index page directory | | | ├ ─ ─ index. The js index page logic | | | └ ─ ─ index. The SCSS index page styling | | | └ ─ ─ index. The config. Js Configuration index page | ├ ─ ─ app. SCSS total project general style | └ ─ ─ app. Js project entry documents | └ ─ ─ app. Config. Js global configuration file └ ─ ─ project. Config. The json project configuration file └ ─ ─ package.jsonCopy the code

2. Entry component app.js

Each Taro application requires an entry component to register the application. The default entry file is app.js in the SRC directory.

To use React in Taro, the entry component must export a React component.

In the entry component we can set global state or access the life cycle of the applets entry instance.

Global configuration file app.config.js

App.config. js will be compiled by taro into app.json, corresponding to the global configuration file in wechat applet.

Therefore, the configuration specification in app.config.js is consistent with the global configuration specification of wechat applets.

This section describes common core configuration items.

3.1: pages

The Pages property is an array representing a list of page paths in the applet that should be changed when pages are added or deleted.

3.2: the window

The window property is an object that sets the status bar, navigation bar, title, and window background color of the applet.

Detailed properties can be viewed: taro-docs.jd.com/taro/docs/t…

3.3: tabBar

The tabBar property is an object that specifies what the TAB bar should look like and the corresponding page to display when the TAB is switched.

3.4: permission

The Permission attribute is an object, which is related to the wechat applet interface permission Settings, such as location permission.

This section lists only a few common configurations. For details, see the official documents

4. Configuration file index.config.js

Index.config. js is compiled by taro into index.json, which is used to configure the window representation of this page.

The configuration item in the page overrides the same configuration item in the window of app.config.js on the current page.