2020-08-13 15:18:26 +08:00
## Installation
### npm
Installing with npm is recommended and it works seamlessly with [webpack ](https://webpack.js.org/ ).
```shell
2020-09-16 10:39:09 +08:00
npm install element-plus --save
2020-08-13 15:18:26 +08:00
```
### CDN
2020-09-16 10:39:09 +08:00
Get the latest version from [unpkg.com/element-plus ](https://unpkg.com/element-plus/ ) , and import JavaScript and CSS file in your page.
2020-08-13 15:18:26 +08:00
```html
<!-- import CSS -->
2020-09-16 10:39:09 +08:00
< link rel = "stylesheet" href = "https://unpkg.com/element-plus/lib/theme-chalk/index.css" >
2020-08-13 15:18:26 +08:00
<!-- import JavaScript -->
2020-09-16 10:39:09 +08:00
< script src = "https://unpkg.com/element-plus/lib/index.js" > < / script >
2020-08-13 15:18:26 +08:00
```
:::tip
2020-09-16 10:42:23 +08:00
We recommend our users to lock Element Plus's version when using CDN. Please refer to [unpkg.com ](https://unpkg.com ) for more information.
2020-08-13 15:18:26 +08:00
:::
### Hello world
2020-09-16 10:42:23 +08:00
If you are using CDN, a hello-world page is easy with Element Plus. [Online Demo ](https://codepen.io/ziyoung/pen/rRKYpd )
2020-08-13 15:18:26 +08:00
2020-10-16 11:14:34 +08:00
< iframe height = "265" style = "width: 100%;" scrolling = "no" title = "Element Plus demo" src = "//codepen.io/ziyoung/embed/rRKYpd/?height=265&theme-id=light&default-tab=html" frameborder = "no" allowtransparency = "true" allowfullscreen = "true" >
See the Pen < a href = 'https://codepen.io/ziyoung/pen/rRKYpd/' > Element Plus demo< / a > by hetech
2020-08-13 15:18:26 +08:00
(< a href = 'https://codepen.io/ziyoung' > @ziyoung< / a > ) on < a href = 'https://codepen.io' > CodePen< / a > .
< / iframe >
If you are using npm and wish to apply webpack, please continue to the next page: [Quick Start ](/#/en-US/component/quickstart ).
