- 博客(195)
- 资源 (4)
- 收藏
- 关注
RSS订阅原创 【常见问题】在js里面引入sass模块
原文章：https://cli.vuejs.org/zh/guide/css.html#css-modules
2023-01-04 16:47:16
356
1
原创 【Vue】项目搭建规范
注意：配置完.prettierrc后，一定要yarn run prettier，将所有文件格式化一下，否则会报错。在根目录下新建.cz-config.js文件并写入配置，之后就可以用 git cz 来代替 git commit。通常我们的git commit会按照统一的风格来提交，这样可以快速定位每次提交的内容，方便之后对版本进行控制。但是如果每次手动来编写这些是比较麻烦的事情，我们可以使用一个工具：Commitizen。在package.json中进行新增。在package.json中新增指令。
2023-01-02 19:35:02
561
2
原创 【Vue】Vite+TS项目搭建
yarn create vite…yarn依赖：yarn add axiosyarn add vuex@next vue-router@4 -Dyarn add types@vue-router -Dvuex有ts支持，所以不需要安装类型文件引入path时，发现有警告，这是因为没有类型文件path 是 node 里的东西，所以下载 node 的类型文件就可以了精简 App.vue 里面的内容删掉根目录下的 style.css，以及 main.ts 里的 import "./style.css "然后 yar
2022-12-07 00:02:45
2207
原创 【uni-app】配置小程序分包
为此，我们在项目中，把 tabBar 相关的 4 个页面放到主包中，其它页面（例如：商品详情页、商品列表页）放到分包中。在项目根目录中，创建分包的根目录，命名为 subpkg。分包可以减少小程序首次启动时的加载时间。
2022-11-14 00:12:59
194
原创 【Vite】Vite基本使用
打开终端输入如下代码：之后会询问你一些参数信息，跟着填写即可初始化完之后默认是没有安装依赖的，需要安装依赖4. 然后再 npm run dev 就可以运行。
2022-11-03 17:23:52
263
原创 【个人总结】作用域插槽的二次封装
然后在父组件使用插槽的时候，通过 #xxx=“scope” => scope.row 在父组件拿到子组件的数据。可以通过作用域插槽，将scope.row赋值给row属性。scope.row可以拿到每一行的数据。
2022-10-20 21:12:07
204
原创 【TS】项目随记
一般不确定的值才限制类型，如果值是确定的就直接写在type.ts文件里面，根据数据返回结果定义类型好处：有提示，避免误写前者根据返回数据格式进行定义，后者是axios返回数据的固定格式，使用的时候直接传这个类型就好导入类型，给post定义泛型，它会将类型添加到返回的结果上默认会类型推导，但是定义泛型可以限制state里面的类型，更安全这里的IRooteState可以放入 type.ts 文件里面导出使用，方便管理注意：state增加属性了以后，接着就是给type.ts文件定义这个属性的类型。
2022-10-18 18:07:28
924
原创 【常见问题】Delete `␍`eslint (prettier/prettier)
Delete `␍`eslint prettier/prettier 处理
2022-09-13 14:19:04
676
原创 【Echarts】学习笔记
/ 注意：在setup执行的时候，ref还没有绑定到节点上面，可以通过onMounted节点挂着完成、nextTick进入下一轮再执行。第三个参数是额外配置，比如渲染器的选择(canvas，svg)，svg性能更高。学习建议：先选择要使用的案例，删掉没用的属性，剩下不懂的属性可以去查看文档。// 因为内部是通过 export xxx 导出的，所以用 * 接收。// 因为内部是通过 export xxx 导出的，所以用 * 接收。// 3. 设置配置，并且开始配置。"ECharts 入门示例"
2022-09-12 19:02:25
408
原创 【Git】深入学习
远程仓库（Remote Respository）之前的操作都是基于本地仓库，别人无法拿到，要想别人拿到就得把代码共享到远程仓库我们可以通过第三方的Git服务器，比如：Github，Gitee，Gitlab等，来搭建我们的 Git 服务Gitee 和 GitLab 公司采用的比较多，而 GitHub 一般用来做开源项目，协议一般用MITgit add .git pull => git fetch + git merge（拿最新的代码合并）git push。
2022-09-03 21:45:10
784
原创 【阿里云】Node+MySQL部署
如果配置了仍然不生效，很有可能是因为开启了防火墙做了双重保护，此时可以通过systemctl stop firewalld.service 关闭防火墙，然后重启服务器就可以生效了。nvm uninstall node-version 卸载。nvm install node-version 下载。nvm use node-version 切换版本。nvm install --lts 安装最新版本。nvm ls-remote 查看可安装。tip：密码强度必须到100%才能通过。nvm ls 查看已安装。..
2022-08-26 13:34:18
615
原创 【Webpack基础】不同的打包模式
每次切换不同打包模式，都需要修改，比较麻烦所以，可以为不同的打包模式 创建一个 配置文件1.2 webpack.prod.js1.3 打包警告此时打包就会报错，因为它不知道你使用哪个配置文件，此时就会使用默认配置build -> 线上打包dev -> 开发打包1.5 问题：dev 打包会清空 dist 目录如果不希望清空，可以通过如下配置：1.6 问题：dev prod 配置文件内容重复借助工具 webpack-merge提取 webpack.prod.js 公共配置提取 web
2022-06-10 14:15:09
574
原创 【Webpack基础】理解Tree Shaking
打包的时候没有使用的方法也会被打包，如果这个方法的业务逻辑很多，就会打包很多没有必要的代码，导致打包体积过大，加载缓慢此时就可以用到 Tree Shaking 来去除 没有使用到的代码Tree Shaking 只支持 ES Module，不支持 CommonJS，因为 ES Module 是确定的去除 没有使用到的代码的前提是 引入的模块是确定的对导入的模块做检查，看你是否使用了这个模块，如果使用了就保留，没有就删除问题：对所有引入的模块都会检查此时就需要在 package.json 里面增加这一项：打包
2022-06-09 00:51:06
393
原创 【webpack基础】Webpack 常用命令总结
2. 初始化默认的package.json文件3. 下载webpack插件到node_modules 并在package.json文件中加上webpack的配置内容4. 局部安装webpack-cli4. webpack常用指令5. 安装loader并将该loader配置到package.json文件中6. 全局安装webpack-dev-server7. 局部安装webpack-dev-server8. 常用loader的安装：处理文件：、 将文件发送到输出文件夹
2022-06-08 17:23:44
1584
原创 【Webpack基础】打包React、Vue代码
index.htmlindex.js打包就会报错原因：webpack 不认识 jsx 语法，此时就需要借助 preset-react安装配置 webpack.config.js.babelrc配置 .babelrcpresets 的执行顺序 是从下往上2. 打包Vue代码2.1 准备工作index.jsApp.vue打包后报错，因为 webpack 不认 vue 文件，此时需要借助 vue-loadervue-loader：js 里 加载 vue 文件vue-templat
2022-06-08 16:25:17
642
1
原创 【Webpack基础】Babel的进一步理解
声明 core-js 版本把这一段代码删掉1.2 core-js是一个标准库，里面主要是用 ES5 去实现一些新增的语法有了它就可以写 ES6，ES7 甚至更高版本的代码它唯一的缺失就是没有 生成器 的实现方法包含了 生成器 方法的实现当 core-js 和 regenerator 结合起来以后，所有的新特性都可以被支持了就相当于是打补丁，用 ES5 的方式 去实现没有被语法降级的缺失，比如 Promise、map 等等就是将 core-js 和 regenerator 整合在了一起在 JS
2022-06-07 22:32:50
313
原创 【Webpack基础】使用Babel处理ES6代码
一些 低版本的 IE 浏览器 无法识别 ES6 语法，此时就需要通过 Babel 进行 语法降级babel-loader：处理 JS 文件，把 babel 和 webpack 建立通信桥梁babel-core：babel 核心库，分析 JS 语法babel/preset-env：用于语法降级babel/polyfill：用于实现语法降级的一些缺失，比如：promise、map安装配置打包 安装 babel/polyfill1.2 按需引入 polyfill没有使用 polyfi
2022-06-07 20:07:14
454
原创 【Webpack基础】JS里的热更新
此时就需要通过热更新解决这个问题counter.jsnumber.jswebpack.config.jsindex.js修改样式不用写这一段代码也可以实现热更新，是因为 style-loader 里面本身有这段代码，只要想实现热更新就少不了这段代码vue -> vue-loader，react -> babel-preset...............
2022-06-07 16:04:22
858
原创 【疑难杂症】webpack的module和CommonJS的module有什么区别呢，ES6 Module有这个module对象吗？
Vincent 15:09:33小夏老师，webpack的module和CommonJS的module有什么区别呢，ES6 Module有这个module对象吗？Vincent 15:11:28可以这样理解吗，webpack的module是用来配置模块的，CommonJS的module是用来导入导出的Vincent 15:12:02ES6是不是就没有这个module，因为它默认就能导出和引入小夏老师 15:14:44都是模块化规范，适用场景不一样小夏老师 15:15:08CommonJs
2022-06-07 15:30:14
128
原创 【Webpack基础】认识HMR热更新
run build 会生成打包文件run dev 不会，它放到内存里了，以此来提升打包速度每次修改都会重新刷新，input输入的内容，临时定义的变量都会丢失配置打包 打包提示这个说明已经开启热更新了
2022-06-06 18:07:36
223
原创 【常见问题】页面跨域和接口跨域
为什么后端设置了跨域，获取页面时还是会提示跨域问题因为跨域是在设置的是这个接口，让这个接口跨域而页面是放在服务器上的，肯定会有跨域问题想要页面跨域，就得在页面的mata标签中设置允许跨域......
2022-06-06 17:26:29
208
原创 【常见问题】浏览器环境、node环境的模块化问题
浏览器环境不支持模块化语法，需要工具翻译（webpack）node环境默认支持CommonJS，要想支持ES6 Module，就得到package.json 设置 type 为 module
2022-06-06 17:22:06
212
原创 【Webpack基础】使用WebpackDevServer
问题：修改了源代码 -> 重新执行 npm run build 进行打包 -> 刷新页面 -> 看到最新的源代码执行的结果解决：通过 WebpackDevServer 优化流程，提升开发效率修改了源代码 -> 直接就看到最新的代码执行结果安装配置 webpack.config.js，指定服务器根目录配置 package.json，添加执行命令执行命令...........................
2022-06-05 16:56:31
483
原创 【Webpack基础】认识sourceMap
可以调试代码当代码有问题的时候，就会告诉我们源代码哪一行出错了需求：dist/main.js 96行 报错了 -> src/index.js 1行
2022-06-05 11:21:08
1246
原创 【Webpack基础】plugins的概念
是一个数组，可以配置插件每次打包都需要手动创建html，比较麻烦html-webpack-plugin 可以帮你自动生成 html 文件安装配置打包后自动帮你生成 html 文件，并帮你引入打包生成的 js 文件引入模板打包后..............................
2022-06-05 09:25:23
569
原创 【Webpack基础】Webpack4 常用依赖及配置
```javascript{ "name": "cart", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "webpack": "webpack --config webpack.config.js", "dev": "webpack-dev-server
2022-06-02 20:12:04
504
原创 【Webpack基础】处理样式（二）
在一些老版本的webpack里面，Loader写成字符串，只会在第一次引入的时候sass编译，下一次引入就不会编译了此时就需要配置项的写法：
2022-06-02 15:21:15
316
原创 【Webpack基础】处理样式（一）
index.htmlindex.cssindex.js报错不支持 .css 文件，需要安装对应的 Loader 处理安装注意一定要指定安装版本，否则会报错配置1.2.2 执行顺序从后往前，从下往上1.2.3 css-loader 的作用当发现css文件之间存在引用关系的时候就会分析出各个文件依赖的关系，根据这些依赖整合在一起最后放到页面的style标签里面例子：logo.css.index.css当项目中遇到 sass、less、stylus 等预处理器如何用 webpack
2022-06-01 23:55:15
318
原创 【ECMAScript】this 总结
2.1.2 全局作用域下声明的变量是挂载到 window 上的2.2 this 在浏览器、node 环境下的表现2.2.1 获取全局对象的方法web: window, self, frames, thisnode: globalweb worker: self通用方式： globalThis(可以在任何上拿到全局作用域)⭐2.2.3 node 环境下在 node 环境下，需要把属性定义到 global 上，否则直接 var 声明，global 拿不到2.2.4 严格模式下，谁调用函数，函数内部
2022-06-01 07:35:04
203
1
原创 【ECMAScript】总结：闭包与回调
铺垫闭包 + 回调 -> JS 高阶函数 High-order function闭包、回调也是高阶函数高阶函数要比普通函数处理更多的问题，更高的集成性和封装性集成性：把所有的功能装到一个程序里面，进行相互的作用封装性：将一个程序所需要的代码封装到函数内部理论上，test 就是一个闭包，原因是 闭包在ECMA262 上的定义：当一个函数被系统创建时，闭包就会被一同创建出来一个函数被定义的时候，一定有一个外界作用域，global scope -> 闭包一个函数同时与外界环境（作用域）捆绑在一起的这种现象叫做闭包
2022-06-01 07:11:12
198
原创 【ECMAScript】变量生命周期、垃圾回收原理
在执行环境的时候，负责管理代码执行过程中使用的内存的js中不需要手动的进行垃圾回收，JS引擎会自动的进行垃圾回收，回收的是有关于值方面的内存是对内存中存储的值进行处理变量的生命周期：说明不再使用的变量是如何不再使用的存在生命周期的变量，-> 局部变量 -> 只在函数执行过程中存在全局变量 -> 直到浏览器关闭结束闭包解除引用 ⭐1.2 垃圾回收机制策略1.2.1 标记清除：mark and sweep排除全局变量排除闭包形成的AO中的变量排除之后还存在的变量就被视为需要清除的变量，销毁带离开环
2022-06-01 06:58:13
158
原创 【知识拓展】super深入
super 有两种用法， 1.对象，2. 函数， 一般是在继承中出现，如果A extends B , 在A 的构造函数中，调用 super（）， 指的就是父类的构造函数，剩余的都是对象的用法， 如果是在子类A 的构造函数中， 调用A.属性， 就相当调用B.prototype.属性 （也就是父类的原型）super 作为对象，调用父类方法的时候，this 是指向 子类的， 如果通过super 给属性赋值， super 就相当于this，赋值的属性就相当于实例的属性所以你这里是属于super 赋值，直接指
2022-05-25 01:52:04
168
原创 【常见问题】RangeError: Maximum call stack size exceeded
class Person { get a() {} set a(val) { this.a = val; // 这里形成了递归，因为只要一修改就会调用setter函数 }}const person = new Person();console.log(person.a = 1); // RangeError: Maximum call stack size exceeded......
2022-05-24 16:01:27
390
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人