Always think that can localize Antd, without npm and DVA so complex configuration environment to develop, and localization later to link flask template rendering mechanism can also be a good combination. Here's how it's implemented:
1. Introduce the relevant links to react:
<script src= "/static/react/react.min.js" ></script><script src= "/static/react/react-dom.min.js" ></script><script src= "Https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js" > </script>
can also use CDN link, I as well as will react down to local use, link may compare card.
2. The introduction of ANTD requires only the following two:
<script src= "/static/antd/dist/antd.js" ></script><link href= "/static/antd/dist/antd.css" rel= " Stylesheet "/>
In the previous DVA project also has, can copy paste over, path in/dva-quickstart/node_modules/antd/dist ...
3. Write code test, HTML Introduction:
<div id= "Message1" ></div><script type= "Text/babel" src= "/static/components/button.js" ></ Script>
ANTD Component code:
Import { Button, Radio, Icon } from ‘antd‘;
Reactdom.render ( <div> <antd. Button type= "PRIMARY" >PRIMARY</ANTD. Button> <antd. Button>default</antd. Button> <antd. Button type= "Dashed" >dashed</antd. Button> <antd. Button type= "Danger" >danger</antd. Button> </div>, document.getElementById (' message1 '));
It is important to note that all component code can be found on the official website, but the import is obviously not a function, remove the line;
Antd is an object, the button is a build, the reference needs to add antd. To work properly.
ANTD introduces the use of normal HTML to localize ant design