对于前端来说，后端主要是提供 http 接口来传输数据，而这种数据传输的方式主要有 5 种： url param query form-urlencoded form-data json 我们分别来看一下： url param我们可以把参数写在 url 中，比如： 12arduino复制代码http://guang.zxg/person/1111 这里的 1111 就是路径中的参数（url param），服务端框架或者单页应用的路由都支持从 url 中取出参数。 query通过 url 中 ？后面的用 & 分隔的字符串传递数据。比如： 12ini复制代码http://guang.zxg/person?name=guang&age=20 这里的 name 和 age 就是 query 传递的数据。其中非英文的字符和一些特殊字符要经过编码，可以使用 encodeURIComponent 的 api 来编码： 1234javascript复制代码const query = "?name=" + encodeURIComponent('光& ...

项目开发离不开工程化的部分，比如创建项目、编译构建、开发时 watch 文件变动自动构建等。Nest 项目自然也是这样，所以它在 @nestjs/cli 这个包里提供了 nest 命令。可以直接 npx 执行，npm 会把它下载下来然后执行： 1npx @nestjs/cli new 项目名 也可以安装到全局，然后执行，更推荐这种： 123npm install -g @nestjs/clinest new 项目名 不过后者要时不时升级下版本，不然可能用它创建的项目版本不是最新的： 1npm update -g @nestjs/cli 那 nest 都提供了啥命令呢？nest -h 看看:有创建新项目的 nest new，有生成某些代码的 nest generate，还有编译构建的 nest build，开发模式的 nest start 等。分别看一下： nest newnest new 我们用过，就是创建一个新的 nest 项目的。它有这么几个选项：–skip-git 和 –skip-install 很容易理解，就是跳过 git 的初始化，跳过 npm install ...

背景原项目使用vue2+vuecli脚手架搭建的。（note: vue cli现已处于维护模式，官方推荐使用create-vue来创建基于vite的新项目了）vuecli，CLI 服务 (@vue/cli-service) 是一个开发环境依赖。它是一个 npm 包，局部安装在每个 @vue/cli 创建的项目中。CLI 服务是构建于 webpack 和 webpack-dev-server 之上的。 configureWebpack此时，webpack配置最简单的方式就是在 vue.config.js 中的 configureWebpack 选项提供一个对象： 12345678// vue.config.jsmodule.exports = { configureWebpack: { plugins: [ new MyAwesomeWebpackPlugin() ] }} 该对象将会被 webpack-merge 合并入最终的 webpack 配置。 如果你需要基于环境有条件地配置行为，或者想要直接 ...

背景：单元测试是什么测试代码块的可行性通常都使用单元测试。单元测试指检查与验证软件中最小可测试单元。对于单元测试中单元定义，一般来说要根据实际情况判定其具体含义。例如JS中单元指一个函数，Java中单元指一个类，GUI中单元指一个窗口等。简而言之，单元就是人为规定最小的被测功能模块。单元测试是软件开发时要进行的最低级别测试活动，独立单元将在与程序其他部分隔离的情况下进行测试。近几年前端技术高速发展，系统功能变得越来越复杂，这对前端工程化的能力提出更高要求，听到工程化的第一反应必然是高质量的代码设计与高质量的代码实现。如何确保这些环节的稳定，那单元测试就必须得应用起来了。单元测试的四大特性就完美诠释了其重要作用。像一些大型前端项目，例如react、vue、babel、webpack等都会接入单元测试，可见单元测试对于这些明星项目来说是多重要的。因为这些大型前端项目需处理大规模的产品及其频繁迭代的功能，这种可持续化的迭代方式迫使它们必须引入自动化测试。进一步看，单元测试有助于增强整体质量与减少运维成本。目前主流的前端单元测试框架主要有jest与mocha，但更推荐使用jest, 因为jes ...

前言Node服务在本地环境运行可用nodemon实现热启动，那照搬这套模式到服务器中让Node服务运行起来可行吗？看上去可行，实际还会存在一些在本地环境也能模拟出来的问题。把本地环境当作服务器，正常来说会存在关机的可能，关机意味着要关闭CMD工具，这样做会把Node进程杀掉。在服务器中是不允许出现这种情况的，期望是即使退出CMD工具，Node进程也会保留下来，继续在服务器后台中运行。基于上述情况，在服务器中部署Node服务一般都会使用相关工具监控其运行状态，因某些原因导致报错、崩溃或关闭，需在适合时机重启该服务。监控Node服务的运行状态可用以下工具解决。 forever pm2 虽然上述提到的三种Node进程管理工具可在不同场景被应用，但在选择工具解决问题前充分认识三者间的差别是很有必要的。 工具 稳定性 运行环境 并发量级 后台运行 代码监听 状态监控 日志管理 集群模式 nodemon 中等 开发环境 无 ❌ ✔️ ❌ ❌ ❌ forever 中等 生产环境 较小 ✔️ ✔️ ❌ ✔️ ❌ pm2 较高 生产环境 较大 ✔️ ✔️ ✔️ ✔️ ✔️ 从 ...

搭建：从零到一搭建数据库打开MongoDB的下载地址，选择以下配置再下载。（右键复制下载地址）打开浏览器下载列表，查看当前文件的下载的地址为https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-rhel80-5.0.6.tgz，再取消当前的下载。 安装打开CMD工具，登录服务器。因为yum不存在Mongodb源，所以无法执行yum install mongodb安装MongoDB。通过以下方式手动安装MongoDB。进入工具目录 12bash复制代码cd /tool 下载MongoDB 12bash复制代码wget https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-rhel80-5.0.6.tgz 解压MongoDB 12bash复制代码tar -zxvf mongodb-linux-x86_64-rhel80-5.0.6.tgz -C /tool 重命名目录 12bash复制代码mv mongodb-linux-x86_64-rhel80-5.0.6 mongodb ...

前端工程化-代码提交规范 | 公司项目分析和结论原公司项目禁用了eslint对.js,.vue文件的eslint，所以使用lint-staged的意义不大。 主要可以做的工作在于commit提交规范； 大致步骤： 1 安装husky， 初始化 husky, 会在根目录创建 .husky 文件夹； 2 安装commitlint @commitlint/config-conventional，执行.husky/commit-msg初始化命令，并且需要配置commitlint.config.js； 3 此时，git commit 已经可以出发commitlint的相关规则了； 4 进一步做好命令行的提示，安装commitizen cz-conventional-changelog ，添加npm set-script commit “git-cz”脚本命令，初始化编写commit指令（npx commitizen init cz-conventional-changelog –save-dev –save-exact） 5 此时，命令行有提示流程了，根据相关rules进 ...

1背景 背景：随着TypeScript项目越来越庞大，项目中会有很多类型声明，有时A开发一个模块时，声明了 TypeA，B声明 TypeB，这两个类型非常相似，但由于A不知道B也声明了类似的类型，导致两人重声明，可能每个人存放类型文件的位置也不一样，日积月累，项目中的类型文件越来越混乱。 整体思路：参考现有方法，并针对项目已有情况进行类型文件整理，规范项目结构。 2常见方案2.1 常见方式方式1 全局唯一 types.ts 文件 优点：方便存储，只需要维护一个文件，类型可以进行复用，方便查看相似类型，避免多次编写。 缺点：如果项目很大，文件会上千行，也会导致命名困难，非常不利于维护、合并冲突将是经常遇到的问题。 123|--src |-- types.d.ts // 全局的类型文件 优化方法1：可以根据一定维度（页面、组件、接口等）划分 namespace 声明时：使用时：直接namespace.Type 即可使用，无需导入。 优化方法2：可以通过 /** */ 形式的注释为给 TypeScript 类型做标记提示： 声明时：使用时： 方式2 ...

node-sass版本导致npm install不成功问题问题描述：在一个20年的项目中，遇到了安装的两个包依赖node版本不一致的问题。node-sass包，不同版本使用的node版本不同，官网会有对应关系；例如node-sass@4\5 版本，需要使用node的14的版本因为项目需要使用element-theme不好升级里面的node-sass版本，故此需要使用对应的node14版本。而另外一个包commander@11版本(应该是vue cli脚手架需要的)，需要node16版本（在那个包的package.json的engines对象里面的node属性指定了版本）。（项目里面依赖最高的commander10版本是要node14，是mockjs@1.0.1-beta3的原因）在这里如果用node14版本去直接yarn install，就会因为comman ...

总结vue2 风格指南和vue3 Style Guide camelCase:驼峰命名; PascalCase:首字母全大写; kebab-case:全小写用横线连接. 必要规则 组件名为多个单词: 组件名应该始终是多个单词的，根组件 App 以及 <transition>、<component> 之类的 Vue 内置组件除外 可以避免跟现有的以及未来的 HTML 元素相冲突，因为所有的 HTML 元素名称都是单个单词的。 组件数据: 组件的 _data 必须是一个函数_。(vue3 无此条) Prop 定义应该尽量详细。_至少需要指定其类型_。 为 v-for 设置键值: 在组件上_总是必须用 key 配合 v-for_，以便维护内部组件及其子树的状态。 避免 v-if 和 v-for 用在一起: _永远不要把 v-if 和 v-for 同时用在同一个元素上。_如果两者同时存在于一个节点上时: vue2 中，v-for 的优先级高于 v-if。_v-if 会在每一个 v-for 循环渲染出来的项上作用，造成性能上的浪费_。 vue3 中，v-if 比 ...