You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
@@ -16,16 +16,16 @@ An enterprise-class UI components based on Ant Design 3.X and Vue.
16
16
17
17
[中文 README](README-zh_CN.md)
18
18
19
-
## 特性
19
+
## Features
20
20
21
21
- An enterprise-class UI design system for desktop applications.
22
22
- A set of high-quality React components out of the box.
23
-
-The whole package of development and design resources and tools.
23
+
-Shared [Ant Design of React](https://ant.design/docs/spec/introduce)design resources.
24
24
25
25
26
-
## 安装
26
+
## Using npm or yarn
27
27
28
-
### 使用 npm 或 yarn 安装
28
+
**We recommend using npm or yarn to install**,it not only makes development easier,but also allow you to take advantage of the rich ecosystem of Javascript packages and tooling.
Ant Design React is dedicated to providing a **good development experience** for programmers. Make sure that you had installed [Node.js](https://nodejs.org/)(> v6.5) correctly.
4
+
Ant Design Vue is dedicated to providing a **good development experience** for programmers. Make sure that you had installed [Node.js](https://nodejs.org/)(> v6.5) correctly.
5
5
6
-
> Before delving into Ant Design React, a good knowledge base of [React](http://facebook.github.io/react/) and [JavaScript ES2015](http://babeljs.io/docs/learn-es2015/) is needed.
6
+
> Before delving into Ant Design Vue, a good knowledge base of [Vue](https://cn.vuejs.org/) and [JavaScript ES2015](http://babeljs.io/docs/learn-es2015/) is needed.
7
7
8
8
9
9
## Playground
10
10
11
11
The following CodeSandbox demo is the simplest use case, and it's also a good habit to fork this demo to provide a re-producible demo while reporting a bug.
During development, you may need to compile and debug JSX and ES2015 code, and even proxy some of the requests to mock data or other external services. All of these can be done with quick feedback provided through hot reloading of changes.
15
+
## Import vue-antd-ui
18
16
19
17
### 1. Installation
20
18
21
-
[antd-init](https://github.com/ant-design/antd-init/) is a demo-only scaffold tool. If you want to create real world projects, [dva-cli](https://github.com/dvajs/dva-cli) and [create-react-app](https://github.com/facebookincubator/create-react-app) is our recommendation.
19
+
[vue-cli](https://github.com/vuejs/vue-cli)
22
20
23
21
```bash
24
-
$ npm install antd-init -g
22
+
$ npm install vue-cli -g
25
23
```
26
24
27
-
Read [the documentation of `antd-init`](https://github.com/ant-design/antd-init/) and [the documentation of `ant-tool`](http://ant-tool.github.io/) to explore more features.
28
-
29
-
> Also, you can try other scaffolds which is provided below:
Ant Design React supports all the modern browsers and IE9+.
66
+
Ant Design Vue supports all the modern browsers and IE9+.
121
67
122
68
You need to provide [es5-shim](https://github.com/es-shims/es5-shim) and [es6-shim](https://github.com/paulmillr/es6-shim) and other polyfills for IE browsers.
123
69
124
70
If you are using babel, we strongly recommend using [babel-polyfill](https://babeljs.io/docs/usage/polyfill/) and [babel-plugin-transform-runtime](https://babeljs.io/docs/plugins/transform-runtime/) instead of those two shims.
125
71
126
72
> Please avoid using both the babel and shim methods at the same time.
127
73
128
-
> If you run into problems with [startsWith ](https://github.com/ant-design/ant-design/issues/3400#issuecomment-253181445), you should import [es6-shim](https://github.com/paulmillr/es6-shim) or [babel-polyfill](https://babeljs.io/docs/usage/polyfill/) as a workaround.
You may encounter problems like [#28](https://github.com/ant-tool/atool-build/issues/28) and [#858](https://github.com/ant-design/ant-design/issues/858), since `[email protected]` doesn't support IE8. You can refer to this [webpack config](https://github.com/ant-design/antd-init/blob/f5fb9479ca973fade51fd6754e50f8b3fafbb1df/boilerplate/webpack.config.js#L4-L8).
157
-
158
-
> More about how to use React in IE8: https://github.com/xcatliu/react-ie8
159
-
160
-
## Customized Work Flow
161
-
162
-
If you want to customize your work flow, we recommend using [webpack](http://webpack.github.io/) to build and debug code.
163
-
164
-
Also, you can use any [scaffold](https://github.com/enaqx/awesome-react#boilerplates) available in the React ecosystem. If you encounter problems, you can use our [webpack config](https://github.com/ant-tool/atool-build/blob/master/src/getWebpackCommonConfig.js) and [modify it](http://ant-tool.github.io/webpack-config.html).
165
-
166
-
If you are trying [parcel](https://parceljs.org), here is [a demo repository](https://github.com/ant-design/parcel-antd).
167
-
168
-
There are some [scaffolds](http://scaffold.ant.design/) which have already integrated antd, so you can try and start with one of these, and even contribute.
169
-
170
74
171
75
## Import on Demand
172
76
173
-
If you see logs like below screenshot, you might be importing all components by writing `import { Button } from 'antd';`. This will affect your app's network performance.
77
+
If you see logs like below screenshot, you might be importing all components by writing `import { Button } from 'vue-antd-ui';`. This will affect your app's network performance.
174
78
175
79
```
176
80
You are using a whole package of antd, please use https://www.npmjs.com/package/babel-plugin-import to reduce app bundle size.
@@ -181,26 +85,27 @@ You are using a whole package of antd, please use https://www.npmjs.com/package/
181
85
However, we can import individual components on demand:
182
86
183
87
```jsx
184
-
importButtonfrom'antd/lib/button';
185
-
import'antd/lib/button/style'; // or antd/lib/button/style/css for css format file
88
+
importButtonfrom'vue-antd-ui/lib/button';
89
+
import'vue-antd-ui/lib/button/style'; // or vue-antd-ui/lib/button/style/css for css format file
186
90
```
187
91
188
92
We strongly recommend using [babel-plugin-import](https://github.com/ant-design/babel-plugin-import), which can convert the following code to the 'antd/lib/xxx' way:
189
93
190
94
```jsx
191
-
import { Button } from'antd';
95
+
import { Button } from'vue-antd-ui';
192
96
```
193
97
194
98
And this plugin can load styles too, read [usage](https://github.com/ant-design/babel-plugin-import#usage) for more details.
195
99
196
-
> FYI, babel-plugin-import's `style` option will importing some global reset styles, don't use it if you don't need those styles. You can import styles manually via `import 'antd/dist/antd.css'` and override the global reset styles.
100
+
> FYI, babel-plugin-import's `style` option will importing some global reset styles, don't use it if you don't need those styles. You can import styles manually via `import 'vue-antd-ui/dist/antd.css'` and override the global reset styles.
0 commit comments