vue学习笔记一：环境搭建

参考教程：Vue 介绍 · Vue.js教程    Vue3 教程 | 菜鸟教程

官方文档：Vue.js

调试工具：Vue调试神器vue-devtools安装 - 简书

断断续续使用过一些vue进行开发， 但未系统性学习，开始系统性学习vue相关内容并且记录。

搭建环境：

使用IntelliJ IDEA 2021.3.2进行开发测试。

1.项目搭建：

        idea添加vue插件，参考：使用idea开发vue初始步骤_lanxiaziyi的专栏-CSDN博客_idea vue

        安装vue-cli工具，使用npm安装并创建项目。

2.第一个程序实现：

使用idea创建VUE项目：

 无Vue时，先在idea中安装vue插件，创建一个test项目。

时间较长，等待项目创建完毕，创建完毕：

目录结构：

运行项目：

访问 http://localhost:8080/，打开界面。

打包项目：

配置编辑项：

运行编译并打包：

打包完成：

目录结构：

使用npm安装并创建vue项目：

安装vue：

npm install vue@next

查看版本：

 vue --version

更新版本：

vue upgrade --next

创建项目：

vue init webpack test

回车：

回车：

输入“Y”：

安装完成：

下载依赖包：

进入项目目录：

cd test

打包开发版本：

cnpm run dev

浏览器测试：

打包发布版本：

cnpm run build

结构目录：