Ant-Design脱构建工具使用

1.将react的相关链接引入:

<script src="https://cdn.bootcss.com/react/16.0.0/umd/react.production.min.js"></script>
<script src="https://cdn.bootcss.com/react-dom/16.0.0/umd/react-dom.production.min.js"></script>
<script src="https://cdn.bootcss.com/babel-core/5.8.38/browser.min.js"></script>

2.将antd引入,只需要下面这两个:(编译后获取node_modules\antd\dist)

<script src="antd.min.js"></script>
<link rel="stylesheet" href="antd.min.css" />

3.写代码测试一下,html引入:

<div id="message1"></div>
<script type="text/babel">
  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'));
</script>

antd是一个对象,Button是其一个组件,引用的时候需要加上antd.才能正常使用。

组件库: https://ant.design

本文链接地址: Ant-Design脱构建工具使用

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注