2017-11-11 07:32:35 +00:00
## Instalación
2017-11-06 11:22:02 +00:00
### npm
2017-11-11 07:32:35 +00:00
Instalar mediante npm es la forma recomendada ya que se integra facilmente con [webpack ](https://webpack.js.org/ ).
2017-11-06 11:22:02 +00:00
```shell
npm i element-ui -S
```
2017-11-11 07:40:06 +00:00
### CDN
2017-11-11 07:32:35 +00:00
Obten la última versión desde [unpkg.com/element-ui ](https://unpkg.com/element-ui/ ) , e importa el JavaScript y los archivos CSS en tu página.
2017-11-06 11:22:02 +00:00
```html
<!-- import CSS -->
< link rel = "stylesheet" href = "https://unpkg.com/element-ui/lib/theme-chalk/index.css" >
<!-- import JavaScript -->
< script src = "https://unpkg.com/element-ui/lib/index.js" > < / script >
```
2017-11-11 07:32:35 +00:00
##Tip
Recomendamos a nuestros usuarios congelar la versión de Elemet cuando usas un CDN. Por favor, refiérase a [unpkg.com ](https://unpkg.com ) para más información.
2017-11-06 11:22:02 +00:00
### Hello world
2017-11-11 07:32:35 +00:00
Si estás usando un CDN, una página con Hello-World es fácil con Element. [Online Demo ](https://jsfiddle.net/hzfpyvg6/14/ )
2017-11-06 11:22:02 +00:00
```html
<!DOCTYPE html>
< html >
< head >
< meta charset = "UTF-8" >
<!-- import CSS -->
< link rel = "stylesheet" href = "https://unpkg.com/element-ui/lib/theme-chalk/index.css" >
< / head >
< body >
< div id = "app" >
< el-button @click =" visible = true" > Button</ el-button >
< el-dialog :visible . sync = "visible" title = "Hello world" >
< p > Try Element< / p >
< / el-dialog >
< / div >
< / body >
<!-- import Vue before Element -->
< script src = "https://unpkg.com/vue/dist/vue.js" > < / script >
<!-- import JavaScript -->
< script src = "https://unpkg.com/element-ui/lib/index.js" > < / script >
< script >
new Vue({
el: '#app',
data: function() {
return { visible: false }
}
})
< / script >
< / html >
```
2017-11-11 07:32:35 +00:00
Si estás usando npm y deseas combinarlo con webpack, por favor continúa a la siguiente página: Quick Start
