vue路由和nodeJS环境搭建

目录

一、vue路由

 二、无痕浏览

 三、nodeJS环境搭建

 四、ElementUI简介

一、vue路由

使用路由跳转不同的组件思路
1、确保引入Vue.vue-router的js依赖
2、首先需要定义组件（就是展示不同的页面效果）
3、需要将不同的组件放入一个容器中（路由集合）
4、将路由集合组装成路由器
5、将路由挂载到Vue实例中
6、定义锚点
7、跳转

 

	
		
		
		
		
	
	
		

			
			
			首页
			关于
			
			
		
	
	

运行效果：

 点击关于

 

 二、无痕浏览

添加关键词 

 运行效果：

多次点击 首页和关于 停留在关于

 

 点击一次回退

 三、nodeJS环境搭建

1、下载nodeJS的安装包
    2、解压nodeJS的解压包，在根目录下新增两个文件夹node_global和node_cache
    3、配置环境变量
        NODE_HOME:配置的是nodeJS解压的根路径D:\initPath\node-v10.15.3-win-x64
        path:%NODE_HOME%;%NODE_HOME%\node_global
        node -v
        npm -v
    4、配置npm的全局模块的下载地址
        npm config set cache "D:\initPath\node-v10.15.3-win-x64\node_cache"
        npm config set prefix "D:\initPath\node-v10.15.3-win-x64\node_global"
        npm config set registry https://registry.npm.taobao.org/
    5、下载github的Vue的项目解压
    6、在解压的项目中是没有node_modules的，在工程的根目录下需要通过npm              install进行再次依赖下载（package.json）
    7、在通过npm run dev 启动项目

 

 

 

 

 

 

 

 

 

 登录之后的界面 

 四、ElementUI简介

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

 ElementUI官网：http://element-cn.eleme.io/#/zh-CN