基於WebStorm, React和Ant.Design開發WebAppDemo

http://blog.csdn.net/chenhaifeng2016/article/details/61196639

///////

另參考http://www.jianshu.com/p/324fd1c124ad

從零開始搭建一個react項目

/////////

前提條件:

已安裝過webstorm和nodejs。


安裝create-react-app和yarn

npm install -g create-react-app yarn


打開WebStorm創建工程



安裝antd

yarn add antd --save


修改app.js代碼

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import { Button } from 'antd';

class App extends Component {
  render() {
    return (
      <div className="App">
        <div className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h2>Welcome to React</h2>
        </div>
          <Button type="primary">Button</Button>
        <p className="App-intro">
          To get started, edit <code>src/App.js</code> and save to reload.
        </p>
      </div>
    );
  }
}

export default App;

修改app.css代碼

@import '~antd/dist/antd.css';

.App {
  text-align: center;
}

運行程序

yarn start


生產環境運行yarn run build


--結束--




發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章