The scaffolding includes the complex configuration of webpack and babel (based on webpack+ES6+react), and the project can be developed when it comes up
The entry file index.js cannot be deleted.
index.html is a template page without script tags, script tags are automatically generated
The package dependency of the newly created project is not based on NPM5, so it is developed on the basis of this project. If you want to continue to add package dependencies, you need to use the npm command, and the previous package dependencies cannot be used.
Solution: delete package-lock.json and re-enter the command npm install
Then according to the template file index.html, use npm run build to build a page that the user actually sees
After that, the problem of wrong path will occur, so you have to download a package to correct the path
After installation, enter the command
The directory structure created based on scaffolding can be developed as follows
Splitting components is based on function points
When you go to find a folder, the index.js file in the folder is found by default, such as the following ./compnents/App to find the index.js under the folder
example:
The first step: write a static page, put bootstrap.css under public, and index in it
Step 2: Put index.css under src
Step 3: Then split the html structure
For the display in the virtual dom object, you must also pay attention when looking for wheels 1: Add an end tag to the input tag 2: class is changed to className
can't write like this
to do this
The next step is to get the data source, 1. Go to the initial data in the App component, represented by an array in the state
2. Then display the data in the list, then in the render method, you must first get let {comments}=this.state;
3. Then <List comments={comments}/> and then in the render in List.js to get the incoming array through the attribute
let {comments}=this.props;
4. Split another item component
5. Get each object value passed in in item
6. To delete the function, you need to click on an item, which can tell the index of the superior component to solve the feature that the key cannot be used as props
7. How to complete data layer-by-layer transfer
When using PubSubJs.js, remember to write the callback function of the code part of the subscription as an arrow function because this points to the problem at this time
