Vue安装及使用

安装:                           

                                            1. Vue

        我们之前的vue和我们的java代码是不是都在一个工程下。没有做到前后端完成分离。企业中前端也会由自己的服务器，也有自己的开发工具。 

                                       2.安装Nodejs服务器

步骤1:node-v14.17.0-x64.msi包

       2:下好之后不要放在中文目录下

       3.验证是否安装完成: 打开cdm命令（win+r）输入命令

                                                2.1 安装npm

        因为前端项目也需要依赖一些插件:比如:axios elementui 那么我们可以使用npm下载并安装到当前项目。

        我们无需安装因为在nodejs中默认带了该软件

验证是否安装完成: 打开cdm命令（win+r）输入命令

                                2.2 安装vue的脚手架

        脚手架的作用:就是用来帮你创建前端vue工程。

        安装的命令: npm install -g @vue/cli

        速度很慢：下完后输入命令

注意:出现版本号了才是真正安装好了

                        3. 使用脚手架创建Vue工程

(1)在cmd窗口中输入

(2)弹出网页如下图

 （3)点击创建

 注意选中好所在的目录后必须按回车键

（4.）

（5.） 

 

（6.）  

 （7.）  

创建完成后的效果
  (8)这是我们创建的工程在windown上

 （9.）安装需要的插件和依赖

安装axios发送异步请求的依赖

                                4.用webstorm打开vue工程

 

在我们的控制台下输入

 

 这两个命令

 

 随便点开一个就能看到我们的Vue网页

 

                                        5.聊聊main.js

 一个组件引用另一个组件:

        当前组件中导入另一个组件 :

import hello from './components/Hello.vue'

 注册另一个组件 :

export default {
  name: 'app',
  //(2)注册组件
  components: {
     hello
  }
}

使用注册的组件

<!--(3)使用组件-->
<hello></hello>

                                        6.说说路由