【Vue】环境搭建

news2024/11/15 9:40:04

Vue 简介:

一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。

优点:

  1. JavaScript扩建
  2. 简化 Dom 驱动

Dom: 文档对象模型 (DOM) 是 HTML 和 XML 文档的编程接口。它提供了对文档的结构化的表述,并定义了一种方式可以使从程序中对该结构进行访问,从而改变文档的结构,样式和内容。DOM 将文档解析为一个由节点和对象(包含属性和方法的对象)组成的结构集合。简言之,它会将 web 页面和脚本或程序语言连接起来。

  1. 响应式数据驱动

了解了 Vue 大概是什么之后,下面我们来进行 Vue 环境的搭建

1. 安装 Node.js

Node.js 是什么?
在 Node.js 之前,JavaScript 只能运行在浏览器中,作为网页脚本使用,为网页添加一些特效,或者和服务器进行通信。有了 Node.js 以后,JavaScript 就可以脱离浏览器,像其它编程语言一样直接在计算机上使用,想干什么就干什么,再也不受浏览器的限制了。因此,Node.js 并不是一门新的编程语言,也不是一个 JavaScript 框架,它是一套 JavaScript 运行环境,用来支持 JavaScript 代码的执行。用编程术语来讲,Node.js 是一个 JavaScript 运行时(Runtime)

下载地址为 node.js官网,选择适合自己的版本安装即可。安装过程一路 next

安装结束后,通过 cmd 命令行输入下列代码查看 node.js 是否安装成功

node -v

安装 node.js 的同时会按照 npm,可通过 cmd命令行输入下列代码查看 npm 是否安装成功

npm -v

在这里插入图片描述

2. 安装 cnpm

cnpm 是什么?
npm的远程服务器在国外,所以有时候难免出现访问过慢,甚至无法访问的情况。因此cnmp 就是另一个我们国内的更快的镜像。

cnmp 镜像官网:http://www.npmmirror.com/?spm=a2c6h.14029880.0.0.73593839L8bWkC

通过 cmd 命令行输入以下代码安装 cnpm

npm install -g cnpm --registry=https://registry.npmmirror.com

3. 安装 Vue CLI

Vue CLI 官网地址 :https://cli.vuejs.org/zh/

通过 cmd 命令行输入以下代码安装(nmp 换为 cnmp 防止因网络问题导致下载不成功):

cnpm install -g @vue/cli

执行完上步就安装完毕了,通过 cmd 命令行输入下列代码查看是否安装成功

vue -V

在这里插入图片描述

4. 安装 webpack

webpack 是一款开源的前端打包工具,安装方式如下:

cnpm install webpack -g

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1853.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Jenkins+Docker 一键自动化部署 SpringBoot 项目

本文章实现最简单全面的 Jenkins Docker Spring Boot 一键自动部署项目。步骤齐全,少走坑路。 环境:CentOS7 Git (Gitee) 实现步骤:在 Docker 安装 Jenkins,配置 Jenkins 基本信息,利用 Dockerfile 和 Shell 脚本实…

CSS 的布局 盒子

目录 块级元素和行内元素 块级元素 特点: 行内元素 特点: 行内元素 和 块级元素 的区别 改变显示模式(把行内元素 变成 块级元素) 盒模型 盒模型图 边框基础属性 内边框、外边框 基础写法: 复合写法 块级元素水平居中 前提&#…

C++知识点大全(第二版)

目录 1 C简介 1.1 起源 1.2 应用范围 1.3 C和C 2开发工具 3 基本语法 3.1 注释 3.2关键字 3.3标识符 4 数据类型 4.1基本数据类型 4.2 数据类型在不同系统中所占空间大小 4.3 typedef声明 4.4 枚举类型 5 变量 5.1 变量的声明和定义 5.2 变量的作用域 6 运算…

如何当好硬软件助理工程师——实习周报(一)

如何当好硬软件助理工程师——实习周报 如何当好硬软件助理工程师——实习周报(一) 文章目录如何当好硬软件助理工程师——实习周报前言一、问题积累1.git 指令2.Coding的使用3.代码中的知识点(HAL库、Flash读写)a.gpio配置b.fla…

程序员必备的画图工具汇总

文章目录1、简介2、draw.io3、Excalidraw4、Xmind5、语雀6、Database6.1 dbdiagram.io6.2 sqldbm6.3 QuickDBD7、UML7.1 plantuml7.2 Graphviz结语1、简介 优秀的作图工具有许多,例如文本绘图工具 PlantUML,流程图设计工具 Draw.io,还有专业…

ORA-01861: literal does not match format string

系统:AnolisOS7.9 数据库:Oracle11.2.0.4 问题描述:执行TSPITR时,报错ORA-01861,如下所示: [oracleliujun~]$ export NLS_DATE_FORMATyyyy-mm-dd hh24:mi:ss [oracleliujun~]$ export NLS_LANGAMERICAN…

手写Mybatis源码(原来真的很简单!!!)

目录一、JDBC操作数据库_问题分析二、自定义持久层框架_思路分析三、自定义框架_编码1、加载配置文件2、创建两个配置类对象3、解析配置文件,填充配置类对象4、创建SqlSessionFactory工厂接口及DefaultSqlSessionFactory实现类5、创建SqlSession会话接口及DefaultSq…

R语言和医学统计学(10):正态性和方差齐性检验

本文首发于公众号:医学和生信笔记,完美观看体验请至公众号查看本文。 医学和生信笔记,专注R语言在临床医学中的使用,R语言数据分析和可视化。 文章目录前言正态性检验shapiro wilk检验kolmogorov smimov检验方差齐性检验两样本方差…

SSH框架重构需求,起码读懂代码和前端的原生JS

文章目录SSH(Spring Struts Hibernate)商城老项目JSPHtmlJsJquery 老项目部署Tomcat上面进行部署可以一次性部署多个项目1.Spring2.Struts3.Hibernate(持久层一个重量级框架)4.里面的请求路径解析SSH(Spring Struts Hibernate)商城老项目JSPHtmlJsJquery 老项目部署 Tomca…

【JavaSE之JDK8新特性】三万字详文带你了解JDK8新特性

JDK8新特性一、Lambda1.1需求分析2.Lambda表达式的初级体验3.Lambda表达式的语法规则3.1.Lambda练习13.2.Lambda表达式练习24.FunctionalInterfa注解说明5.Lambda表达式的原理6.Lambda表达式的省略写法7.lambda表达式的使用前提8.lambda和匿名内部类的对比二、接口中新增的方法…

#define宏的妙用!实现你以为的函数offsetof等

目录 一.#define 1.1#define的使用 1.2在define定义标识符的时候,要不要在最后加上 ;? 二.#define定义宏 2.1好代码的写法: 2.2#define 替换规则 2.3#和## 三.带有副作用的宏参数 四.宏和函数的对比 五.实现offetof 思路解析过程: 代码实现&am…

破解系统密码

一、利用5次shift漏洞破解win7密码 1.1 漏洞 1. 在未登录时,连续按5次shift键,弹出程序C:\Windows\System32\sethc.exe 2. 部分win7及win10系统在未进入系统时,可以通过系统修复漏洞篡改系统文件名! 注意:如win7或win…

SpringBoot/Spring AOP默认动态代理方式

Spring 5.x中AOP默认依旧使用JDK动态代理SpringBoot 2.x开始,AOP为了解决使用JDK动态代理可能导致的类型转换异常,而使用CGLIB。在SpringBoot 2.x中,AOP如果需要替换使用JDK动态代理可以通过配置项spring.aop.proxy-target-classfalse来进行修…

【Linux】7.0 信号

文章目录信号的基本概念kill -l 查看信号列表信号的处理方式signal( ) 自定义处理信号信号的产生方式键盘产生进程异常(core dump)系统调用软件条件信号的发送(OS)信号常见相关名词解释进程接收处理信号原理信号集函数的使用打印p…

【Redis】3.详解分布式锁

文章目录1. 什么是分布式锁2. 分布式锁的特点3. 常见的分布式锁4. 实现分布式锁5.解决分布式锁中的原子性问题5.1 Lua脚本5.2 使用Java代码调用Lua脚本实现原子性1. 什么是分布式锁 分布式锁是指分布式系统或者不同系统之间共同访问共享资源的一种锁实现,其是互斥的…

【Django框架】——20 Django视图 02 路由命名和反向解析

文章目录一、 路由命名二、reverse反向解析三、通过URL模板页面进行传参四、namespace1.reverse反向解析2.url模板标签在 Django 项⽬中,⼀个常⻅需求是获取最终形式的 URL,⽐如⽤于嵌⼊⽣成的内容中(视图和资源⽹址,给⽤户展示⽹…

《网络安全笔记》第七章:注册表基础

一、注册表基础 1、概述 注册表是windows操作系统、硬件设备以及客户应用程序得以正常运行和保存设置的核心“数据库”,也可以说是一个非常巨大的树桩分层结构的数据库系统注册表记录了用户安装在计算机上的软件和每个程序的相互关联信息,它包括了计算…

【UDS】ISO14229之0x2F服务

文章目录前言一、理论描述二、使用步骤1.请求2.响应总结->返回总目录<- 前言 简称&#xff1a; “InputOutputControlByIdentifier”&#xff0c;根据标识符控制输入输出 功能&#xff1a; 根据标识符控制输入输出服务用于替换输入信号的值、电控单元内部参数或控制电子…

Telnet连接

❤️人生没有白走的路&#xff0c;每一步都算数❤️ 你是否安装Telnet没毛病&#xff0c;但登录总报错&#xff1f; 巧了&#xff0c; 我也遇到了。 于是我打开浏览器尝试搜索&#xff0c;有许多说的并不详细。 所以呢就有了这篇文章&#xff01; 首先我们准备实验环境&#xf…

oracle中替换字符串的不同写法

replace函数 replace(原字段&#xff0c;“原字段旧内容“,“原字段新内容“) 例如将DEPTNO字段值中的0替换为1&#xff1a; TRANSLATE TRANSLATE(expr, from_string, to_string) from_string 与 to_string 以字符为单位&#xff0c;对应字符一一替换。 用法示例&#xf…