初识webpack
yarn包管理器(必须)快速、可靠、安全的依赖管理工具。和 npm 类似, 都是包管理工具, 可以用于下载包, 就是比npm快
中文官网地址: https://yarn.bootcss.com/
下载yarn下载地址: https://yarn.bootcss.com/docs/install/#windows-stable
windows - 软件包(在笔记文件夹里)
mac - 通过homebrew安装(看上面地址里)
mac如果没安装过homeBrew先运行这个命令
1$ /usr/bin/ruby -e "$(curl -fsSL http://cdn.jsdelivr.net/gh/ineo6/homebrew-install/install)"
上面命令不行: 试试这个: curl -o- -L https://yarnpkg.com/install.sh | bash (直接安装yarn)
==不要安到带中文的路径下, 建议在C盘/==
使用yarn与npm类似, 可以试试, 新建一个 ...
vue应用3—HR-saas中台系统
1.项目设计
1.人力资源的环境搭建vue-element-admin的了解和介绍目标: 学习和了解通用的vue后台集成方案**vue-element-admin**
vue-element-admin 是一个后台前端解决方案，它基于 vue 和 element-ui实现。它使用了最新的前端技术栈，内置了 i18 国际化解决方案，动态路由，权限验证，提炼了典型的业务模型，提供了丰富的功能组件，它可以帮助你快速搭建企业级中后台产品原型。
vue-element-admin 是一个后台集成方案, 集成了PC项目中很多的业务场景和功能, 尤其在当下SPA的趋势下,我们可以从中获得很多成熟的解决方案.
vue-element-admin 有一个成熟的集成方案，里面包含了所有的业务功能和场景,并不适合直接拿来进行二次开发, 但是可以通过该项目中的一个案例来进行学习和使用.
这里是官网地址
这里是线上demo地址
如果你想查看该项目的具体功能和效果，可以拉取代码，启动进行预览￥
123$ git clone https://github.com/PanJiaChen/vue-elemen ...
vue应用2-vue移动端-头条demo
一、项目初始化
目标
能使用 Vue CLI 创建项目
了解 Vant 组件库的导入方式
掌握制作使用字体图标的方式
掌握如何在 Vue 项目中处理 REM 适配
理解 axios 请求模块的封装
使用 Vue CLI 创建项目
如果你还没有安装 VueCLI，请执行下面的命令安装或是升级：
1npm install --global @vue/cli
在命令行中输入以下命令创建 Vue 项目：
1vue create toutiao-m
1234Vue CLI v4.2.3? Please pick a preset: default (babel, eslint)> Manually select features
default：默认勾选 babel、eslint，回车之后直接进入装包
manually：自定义勾选特性配置，选择完毕之后，才会进入装包
选择第 2 种：手动选择特性，支持更多自定义选项
1234567891011? Please pick a preset: Manually select features? Check the feature ...
vue应用1—用vant和node实现网易云音乐案例
本地接口项目部署
下载网易云音乐node接口项目, 在本地启动, 为我们vue项目提供数据支持
项目地址
备用地址
下载后, 安装所有依赖, 在本地启动起来, 测试访问此地址是否有数据
总结: 前端请求本地的node项目, node服务器伪装请求去拿网易云音乐服务器数据转发回给自己前端
今日学习目标
能够掌握vant组件库的使用
能够掌握vant组件自定义样式能力
能够掌握组件库使用和文档使用能力
能够完成网易云音乐案例
1. 案例-网易云音乐1.0 网易云音乐-本地接口
目的: 请求网易云音乐服务器API接口-获取数据
总结: 反向代理就是用本地开启cors的服务器去转发请求拿到数据
1.1 网易云音乐-本地接口启动
目的: 启动本地网易云音乐API服务
在今天的笔记铺垫中, 大家自学下载了一个项目启动即可
1.2 网易云音乐-前端项目初始化
目标: 初始化项目, 下载必备包, 引入初始文件, 配置按需自动引入vant, 创建页面组件
初始化工程
1vue create music-demo
下载需要的所有第三方依赖包
1yarn add axios van ...
Node.js笔记(2)
npm介绍NPM是随同NodeJS一起安装的包管理工具，能解决NodeJS代码部署上的很多问题，常见的使用场景有以下几种：
允许用户从NPM服务器下载别人编写的第三方包到本地使用。
允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。
网站npmjs.com 网站 是用来搜索npm包的
npm命令行工具npm也有版本概念，可以通过npm –version来查看npm的版本
升级npm(自己升级自己)：
1npm install --global npm
常用命令
npm init(生成package.json说明书文件)
npm init -y(可以跳过向导，快速生成)
npm install
一次性把dependencies选项中的依赖项全部安装
简写（npm i）
npm install包名
只下载
简写（npm i 包名）
npm install –save 包名
下载并且保存依赖项（package.json文件中的dependencies选项）
简写（npm i 包名）
–sa ...
Node.js笔记(1)
根据B站黑马记录的笔记，并且也做了对应的思维导图，搭配食用更佳
Node.JS简介何为Node.JS
Node.JS为JavaScript运行时
Node.JS是JavaScript的运行平台
它既不是一门语言，也不是框架，它是一个平台
Node.JS中的JS
Node.JS没有dom和bom
EcmaScript
Node.JS在JavaScript执行环境中为JavaScript提供一些服务器级别的API
文件读写
网络服务构建
网络通信
http服务器
……
Node.JS构建于Chrome的V8引擎
代码只是具有特定格式的字符串
引擎可以认识它，帮你解析和执行
Google Chrome的V8引擎是目前公认的解析执行JavaScript代码最快的
Node.js的作者把Google Chrome中的V8引擎移植出来，开发了一个独立的JavaScript运行时环境
Node.JS的特性
envent-driven 事件驱动
non-blocking I/O mode 非阻塞I/O模型（异步）
ightweight and efficent. 轻量 ...
Git
1.Git初步认识1.1Git操作1.1.1基础操作
git init （初始化仓库）
git status （检查文件，仓库状态）
git add 文件名.文件后缀（添加文件至暂存区）
git commit -m “更新记录” （提交）
git log （查看日志）
gitk （图形界面）-patch（差异）
1.1.2远程仓库操作
git config –global user.name “账户名” （绑定账户）
git config –global user.email “绑定邮箱” （绑定账户）
git clone GitHub仓库地址 （加载到本地仓库）
git remote add 自定义仓库标识名 仓库地址 （连接GitHub仓库）
git remote show （显示连接的仓库）
git remote show 仓库标识名 （显示仓库信息）
git push 仓库标识名 main（推送到远程仓库）
git push –set -unstream 仓库名 main（设置默认push仓库名）
git remote remove 仓库标识名 （移除仓库）
git pull ...
JavaScript-4
JavaScript性能优化什么是内存管理
申请内存空间
使用内存空间
释放内存空间
JavaScript在内存管理上与其它语言是类似的，也是经过了以上三个阶段。
什么是垃圾回收如果程序在后续的执行中，发现某些对象不再被引用时就会被认为是垃圾
JavaScript的执行引擎会回收这些垃圾对象所占用的内存空间，这个过程就是JavaScript的垃圾回收。(如果某个对象一直可以被访问使用，就不是垃圾，而这种可以被访问到的对象，我们称之为’可达对象’)
所谓”可达对象”：指的就是可以被访问到的对象就是可达对象。
引用计数算法优缺点123456优点 1、发现垃圾立即回收 2、最大限度的减少了程序的暂停 缺点 1、无法回收循环引用的对象 2、时间开销比较大
标记清除算法介绍第一个阶段，遍历所有对象，找到活动的对象，然后进行标记
第二个阶段还是会遍历所有对象，并对没有标记的对象进行清除
V8引擎介绍V8引擎的性能是非常高的。性能高的原因：
第一：优秀的内存管理机制
第二：V8引擎采用即时编译。也就是可以直接将javascript代码翻译成机器码进行执行。 ...
JavaScript-3
模块化模块化的发展过程123456var moduleObj = { userName: 'zhangsan', fn: function () { console.log('hello world') }}
使用方式
12345678910<html> <head> </head> <body> <script src="a.js"></script> <script> moduleObj.fn() </script> </body></html>
立即执行函数的方式
通过立即执行函数的方式为模块提供私有空间
12345678910111213; (function () { var userName = 'li ...
JavaScript-2
Generator函数基本使用Generator函数也称之为生成器函数，可以用来生成迭代器，。也就是可以通过for…of来遍历Generator函数.并且Generator函数提供了一种异步编程的解决方案。
生成器函数和普通函数不一样，普通函数是一旦调用就会执行完毕，但是生成器函数中间可以暂停，也就是执行一会歇一会。
Generator函数的创建
123456789101112131415161718 function* go() { console.log(1); let a = yield 'a'; console.log(2); let b = yield a; console.log(3); return b; } let it = go();let r1 = it.next();console.log(r1);let r2 = it.next('b的值');console.log(r2);let r4 ...
