vue的基础和安装

Vue 基础

: 更少的时间,干更多的活. 开发网站速度快，开发更加的效率和简洁, 易于维护, 快!快!快!就是块 (甚至测试, Java, Python工程师都要学点vue, 方便与前端沟通)现在很多项目都是用vue开发的

1.==渐进式==javacript==框架==, 一套拥有自己规则的语法

官网地址: cn.vuejs.org/ (作者: 尤雨溪)

渐进式：

渐进式: 逐渐进步, 想用什么就用什么, 不必全都使用

库和框架：

概念：

• 库: 封装的属性或方法 (例jquery.js)
• 框架: 拥有自己的规则和元素, 比库强大的多 (例vue.js)

开发方式：

• 传统开发模式：基于html/css/js文件开发vue
• 工程化开发方式**：在webpack环境中开发vue**，这是最推荐, 企业常用的方式

脚手架

1.作用：辅助搭建项目的工具

2.@vue/cli的安装

​ 1.安装：npm install @vue/cli

​ 2.创建项目： vue create 项目名 注意项目名不能有大写 和中文 、特殊符号等

​ 3.运行项目：

​ 1.切到项目根目录 cd 项目名

​ 2.运行项目 ： npm run serve

​ 4.配置脚手架项目

​ 1.在vue-config.js 配置完成重启打包脚本

module.exports = defineConfig({
  transpileDependencies: true,
  devServer: { //自定义服务的配置
    port: 3000,
  },
  // 提示代码
  lintOnSave:false
})

​ 5.Vue单文件

​ 1.三大元素

​ 1.template 放html ，template有一个限制：下面只能有一个根标签

​ 2.script 放js ，好处 ：js作用域是独立的

​ 3,style 放样式的 ， style作用域配合scoped属性可以独立