Vue学习笔记

VUE笔记(一）

time: 2021/7/10

官方：介绍 — Vue.js (vuejs.org)

一、什么是vue

二、安装环境

​ 2.1. NodeJs (交互式编程)

​ 退出 : .exit

​ npm：node的模块管理

​ 2.2. 安装ES模块（vue)

​ npm install vue @vue/cli @vue/cli-init -g （-g 表示全局安装，安装在安装目录）

​ npm view vue 了解某一某块

​ npm install axios -save（安装在项目文件，出现在package里）

​ 2.3. VSCODE

​ vscode安装插件vetur

三、使用

3.1帮助

​ vue --help

3.2创建项目

1、命令行进入项目目录
2、输入命令：vue create “项目名”
3、等待项目安装完成
4、可以进入编辑（利用VScode）
5、在vscode终端输入npm run "命令"可执行相应命令
如： npm run server :开启服务器
npm run build: 编译

3.3目录结构

​ public： 存放html、js（JavaScript)

​ index.html：

​ src：(ES6.0)->WebPack翻译->前端 会产生一堆js、css文件插入页面

​ App.vue：插件，用于渲染

​ main.js：将App.vue替换到网页中

​ package.json：npm的管理配置文件（类似android 的 gradle、java里的maven）（npm install安装目录）（npm run运行寻找的文件）