方法一:引入CDN
使用起来最简单的方法,直接引入CDN就可以工作了
<!-- 引入样式 --> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-default/index.css">
<!-- 先引入 Vue --> <script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- 引入组件库 --> <script src="https://unpkg.com/element-ui/lib/index.js"></script>

最简单的页面效果

方法二:npm安装(node版本需要6.x.0以上)
安装步骤:
官网给出的安装方法:
node输入命令行 npm i element-ui -S
我是在本地安装的没有全局安装,这样需要在项目地址安装一些别的一老:VUE和webpack等

出现的问题:

这个是package文件的配置问题出错,解决办法:
1.直接修改package.json文件内容
2.npm命令行重新初始化一下
npm init
根据提示修改信息,注意version是1.0.0

npm init -f 查看信息
接着npm install 安装项目需要的依赖环境

这样下载的项目很完整,有很多完整的项目示例
 
方法三:自己开发使用,应用空白模板
文件结构:

node命令行进入文件夹

运行:
npm run dev

运行成功

会直接打开页面,并且实时更新调试

npm安装的会提示具体错误信息

src内创建的vue文件修改后会实时刷新内容的,不需要每次都运行
 
编译项目:npm run build命令
执行后会输出编译好的项目文件

Element-UI安装和项目开发的更多相关文章

  1. 安装java项目开发环境

    搭建java 查看本机是否已有java 如果有,请卸载. 下载jdk 复制到服务器中 临时配置你在shell里面改,只是做了临时更改啊,一重启就没了 配置到系统的环境变量里 export JAVA_H ...

  2. Element Ui 安装以及配置

    npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm i element-ui -S 引入 Element 你可以引入整个 Element,或是根据需要 ...

  3. 🎉 Element UI for Vue 3.0 来了!

    第一个使用 TypeScript + Vue 3.0 Composition API 重构的组件库 Element Plus 发布了 ~ 2016 年 3 月 13 日 Element 悄然诞生,经历 ...

  4. vue.js+element ui Table+spring boot增删改查

    小白初学,不懂的还是太多了,找了好多资料才做出来的先记录一下 1.先用Spring boot创建一个包含了增删改查的项目 2.创建vue.js项目 3.安装Element UI (1)进入项目文件夹下 ...

  5. element ui Angular学习笔记(一)

    1.element ui安装 npm i --save element-angular 2.Angular-cli引入 引入后需要开启ElModule.forRoot(),也可以单独引入某个组件入El ...

  6. Electron-vue实战(一)—搭建项目与安装Element UI

    Electron-vue实战—搭建项目与安装Element UI 作者:狐狸家的鱼 本文链接 GitHub:sueRimn 一.新建项目1.初始化项目打开cmd,新建一个项目,我使用的是electro ...

  7. Vue + Element UI项目初始化

    1.安装相关组件 1.1安装Node 检查本地是否安装node node -v 如果没有安装,从Node官网下载 1.2安装npm npm -v 如果没有安装:使用该指令安装: npm install ...

  8. FastAPI实践项目:SayHello(FastAPI + vue.js + axios + element ui)

    目录 简介 翻版 VS 本尊 后端服务 源码 接下来 简介 这次带来的是FastAPI + vue.js + axios + element ui (一个html文件里使用的) 实现的<Flas ...

  9. [Openwrt 项目开发笔记]:PHP+Nginx安装(七)

    [Openwrt项目开发笔记]系列文章传送门:http://www.cnblogs.com/double-win/p/3888399.html 正文: 在上一节中,我们已经搭建了MySQL数据库了,因 ...

随机推荐

  1. Docker和Rancher

    Docker打包流程: Dockerfile文件和要打包docker的文件放在同级目录下: 1. docker build -t proj:proj-app:0.0.1 返回tagXXX 2. doc ...

  2. InvokeRequired和Invoke(转)

    C#中禁止跨线程直接访问控件,InvokeRequired是为了解决这个问题而产生的,当一个控件的InvokeRequired属性值为真时,说明有一个创建它以外的线程想访问它.此时它将会在内部调用ne ...

  3. Firedac 数据连接池的应用

    procedure TForm2.Button1Click(Sender: TObject); begin if not FDConnection1.Connected then FDConnecti ...

  4. go thrift报错问题--WriteStructEnd

    问题 go thrift开发过程中,多个goroutine共用一个client时,报错: panic: runtime error: index out of range goroutine 24 [ ...

  5. Linux系统下启动tomcat报错【java.util.prefs.BackingStoreException: Couldn't get file lock】的解决方法

    Linux环境下,启动tomcat报出如题的警告信息,虽然对系统正常使用没有多大影响,但是会导致tomcat的日志垃圾信息很多,而且看起来很不爽... 具体的警告信息如下: Jan , :: PM j ...

  6. PHP-不同Str 拼接方法性能对比

    问题 在PHP中,有多种字符串拼接的方式可供选择,共有: 1 . , .= , sprintf, vprintf, join, implode 那么,那种才是最快的,或者那种才是最适合业务使用的,需要 ...

  7. 自动加载以及Composer的实现

    类的自动加载 两个函数 __autoload()魔术方法.spl_autoload_register 当php文件中使用了new关键字实例化一个对象时,如果该类没有在本php文件中被定义,将会触发__ ...

  8. influxDB硬件配置指南

    原地址:https://docs.influxdata.com/influxdb/v1.6/guides/hardware_sizing/ 警告!此页面记录了不再积极开发的InfluxDB的早期版本. ...

  9. linux lftp

    1.登录 lftp 用户名@站点 口令: 例如: lftp jiangzhaowei@192.168.199.73 口令:****** lftp jiangzhaowei@192.168.199.73 ...

  10. Hadoop2.2.0 eclipse插件编译及Ecliipse配置说明(图文版)

    一.引言: 最近在做一个城商行项目的POC测试it版本,涉及到编译Linux64bti的源码和开发插件使用,作为笔记分享给大家. 二.插件编译 Hadoop2x版本的Eclipse插件已经单独抽取成独 ...