ElementUI 入门与deJS环境搭建

最新推荐文章于 2024-07-25 09:12:01 发布
最新推荐文章于 2024-07-25 09:12:01 发布
阅读量1k 收藏 14
点赞数
分类专栏： vue+element-UI(12)
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_45105634/article/details/101073995
版权
本文介绍了ElementUI，一个基于Vue2.0的组件库，并讲解了Vue+ElementUI的安装，特别是详细阐述了Node.js环境的搭建过程，包括下载、解压、配置环境变量和npm全局模块路径。
摘要由CSDN通过智能技术生成

1. ElementUI简介

我们学习VUE,知道它的核心思想式组件和数据驱动,但是每一个组件都需要自己编写模板,样式,添加事件,数据等是非常麻烦的,
所以饿了吗推出了基于VUE2.0的组件库,它的名称叫做element-ui,提供了丰富的PC端组件

ElementUI官网：点击进入

注1：类似前端框架还有iview

2. Vue+ElementUI安装

2.1 CDN方式

<!-- 1. 导入css -->
  <link href="https://cdn.bootcss.com/element-ui/2.8.2/theme-chalk/index.css" rel="stylesheet">
  <!-- 2. 引入vue和vue-router-->
  <script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>
  <!-- 未使用vue路由功能可不导入 -->
  <script src="https://cdn.bootcss.com/vue-router/3.0.6/vue-router.js"></script>
  <!-- 3. 引入ElementUI组件 -->
  <script src="https://cdn.bootcss.com/element-ui/2.8.2/index.js"></script>

2.2 NPM(略，需要配置NodeJs环境)
演示Element在vue中的实例


<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>elementui入门</title>
		<!-- 1. 导入css -->
		<link href="https://cdn.bootcss.com/element-ui/2.8.2/theme-chalk/index.css" rel="stylesheet">
		<!-- 2. 引入vue和vue-router-->
		<script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>
		<!-- 未使用vue路由功能可不导入 -->
		<script src="https://cdn.bootcss.com/vue-router/3.0.6/vue-router.js"></script>
		<!-- 3. 引入ElementUI组件 -->
		<script src="https://cdn.bootcss.com/element-ui/2.8.2/index.js"></script>
		<style>
			.el-row {
最低0.47元/天 解锁文章
BK_201H
关注
  • 0
    点赞
  • 踩
  • 14
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
NodeJS环境搭建
qq_44493832的博客
08-05 1057
文章目录Node.js是什么?npm是什么?Node.js环境搭建配置环境变量配置npm全局模块路径和cache默认安装位置如何运行下载的Node.js项目?启动项目 Node.js是什么? Node.js是一个基于Chrome V8引擎的[JavaScript运行环境]。 Node.js使用了一个事件驱动、非阻塞式I/O 的模型。 Node.js是一个让JavaScript运行在...
Node.js项目搭建
冰凉的枷锁的博客
12-03 3252
一、使用Node搭建服务器项目 //全局安装 express sudo npm install -g express-generator //使用ejs创建工程 express -e NodeTest //进入工程 cd NodeTest //下载项目所需的基本模块 cnpm install //运行项目 npm start //浏览器输入访问 http://localhost:3000/ ...
nodejs下载安装和vue+elementUi搭建流程和学习资源
weixin_44215249的博客
02-16 394
安装使用之前，先了解这4个东西是用来干什么的。 npm: Nodejs下的包管理器。 webpack: 它的主要用途是根据CommonJS的语法所有需要发布的静态资源做相应的准备，比如资源的合并和打包。 vue-cli: 用户生成Vue过程模板，即给你一套vue的结构，包含基础的依赖库。通过npm install -g @vue/cli安装。 element-ui: 网站快速成型工具,一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库。 一、下载安装Nodejs，安装完成之后才可以使用
node环境的搭建
weixin_53998054的博客
12-04 1508
node环境的搭建
Node搭建方式
wenxiukeke的博客
12-30 225
Node搭建方式一：(选择长期稳定版) 官网下载.msi安装包：https://nodejs.org/zh-cn/ 全程下一步 在命令行工具中输入node -v 搭建方式二：(选择长期稳定版) 官网下载.zip安装包：https://nodejs.org/zh-cn/ 解压下载好的安装包 在高级系统设置中手动配置环境变量 在命令行工具中输入 node -v 搭建方式三： 下载NVM：ht...
dejs:deno 的 ejs 模板引擎
08-04
import * as dejs from "https://deno.land/x/dejs@0.10.1/mod.ts" ; renderFile (filePath: string, params: Params): Promise<Deno> 从文件渲染，输出 Deno.Reader render (body: string, params: ...
comodo:一个方便的 No​​deJS 工具，用于收集和发布运行过程的统计信息
06-27
一个方便的 No​​deJS 工具，用于收集和发布运行过程的统计信息。 该项目处于早期开发阶段。 一旦实现基本功能，就会填写自述文件。 之后它将被注册到中央 npm 中。 许可证 - “麻省理工学院许可证” 版权所有 ...
preuba_node_audara
03-27
测试NO​​DEJS AUDARA Pruebabásicapara desarrollador后端科门赞多 :rocket: 在当地生产和销售产品的过程中，必须遵守的条件。要求前 :clipboard:安装 :wrench: 地方性的复制品。 git clone ...
搭建node服务器
LJDongH的博客
04-15 196
搭建node服务器 一. 下载node 1. 下载 node js 2. 写 js 代码 3. 用 node 去 运行 js 二. node 搭建服务器 5.桌面新建文件 aaa 6. 终端 (win + r cmd 回车) 7. 终端 输入: cd aaa 8. 确定 终端是否 处于 aaa 路径之下 9. 终端 输入 npm init 10. 一直 回车 11. 检查 aaa 文件夹 12. 将 aaa 文件夹 拖入 vsCode中 13. 在
nodejs的搭建
weixin_43453916的博客
01-02 156
const express= require(“express”) const logger = require(“morgan”) const bodyparser =require(“body-parser”) const router =require("./router/newrouter") const index =express(); index.use(logger(“dev”)...
NodejsExpressjsVuejsElementUI全栈开发王者荣耀手机端官网和管理后台
08-10
Node.js (Express.js) Vue.js (Element UI) 全栈开发王者荣耀手机端官网和管理后台
Node Js开发环境的搭建
最新发布
炑焽的博客
07-25 764
通过自动化繁琐的设置和配置工作，帮助开发者快速启动新项目。常见的Node脚手架工具包括Yeoman、Express Generator、Create React App等。用于快速创建和配置项目的基本结构和配置文件。脚手架工具可以帮助开发者快速启动新项目，减少手动配置和重复工作，提高开发效率。
NodeJs的安装与配置（安装包）
qq_62331938的博客
09-06 5174
上一篇文章分享了vue的路由，本文将分享nodejs的安装与配置。
前端环境搭建——node（保姆级）
weixin_67722778的博客
01-21 1715
借鉴了一些链接，自己在使用过程中也在记录
使用node搭建服务
github_39088222的博客
07-12 2715
最近在看node，听说学会了node就可以做全站所以就想了解下。下面就是自己使用node搭建的一个小服务。 首先要安装node，直接官网下载傻瓜式安装就可完成。 Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。 Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型，使其轻量又高效。Node.js 的包管理器 npm，是全球最大的开源库生态系统。（...
ElementUI和nodeJS介绍
大屌的博客
08-05 754
文章目录前言nodeJS环境搭建测试 前言 在我的上篇博客 Vue路由 中说到了组件，大家也明白了组件的重要性，Vue基本就是靠组件来完成的，在这里大家会发现一个很重要的问题，因为大部分都是组件来完成的，所以编写组件是非常麻烦的，为了解决这一问题，饿了吗推出了基于VUE2.0的组件库,它的名称叫做element-ui,提供了丰富的PC端组件。 ElementUI官网：http://ele...
elementUI入门和nodeJS环境搭建
what_to的博客
08-05 520
elementUI入门和nodeJS环境搭建1. ElementUI简介导入插件1.node.js是什么？2.npm是什么3.Node.js环境搭建环境搭建流程下载解压配置环境变量配置npm全局模块路径和cache默认安装位置5、下载github的Vue的项目解压运行项目运行结果为 1. ElementUI简介 我们学习VUE,知道它的核心思想式组件和数据驱动,但是每一个组件都需要自己编写模板,样...
ElementUi和Nodejs搭建
钰团的博客
08-05 262
ElementUi和Nodejs搭建ElementUI简介nodejs环境搭建下载nodeJS的安装包解压nodeJS的解压包配置环境变量配置npm的全局模块的下载地址 ElementUI简介 我们学习VUE,知道它的核心思想式组件和数据驱动,但是每一个组件都需要自己编写模板,样式,添加事件,数据等是非常麻烦的, 所以饿了吗推出了基于VUE2.0的组件库,它的名称叫做element-ui,提供了丰...
Vue 中 createElement 使用详解
热门推荐
陆小森_红齐飘飘的博客
09-02 3万+
test
Node的环境配置和CDN方式开发Vue+elementUl
yoonbongchi的博客
08-25 1219
Node的环境配置和CDN方式开发Vue+elementUl1. ElementUI简介2. Vue+ElementUI安装1. Node.js是什么1. 打开命令窗口2. 切换到d盘3. 进入指定目录下面的才是关键代码4. 进行依赖安装命令执行完后，你会发现，项目的根目录下多了一个node_modules文件夹，那里面就是从npm远程库里下载的模块，然后“安装”到你的项目中，此步骤，可理解成修改maven的pom文件添加依赖，然后maven再从中央仓库下载依赖那pom文件在哪里呢？其实就是项目中的pack
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值