代码管理
文章平均质量分 66
进阶__前端
这个作者很懒,什么都没留下…
展开
-
vue3.0 axios封装
vue3 + ts + axios 封装请求原创 2022-09-30 09:56:17 · 1549 阅读 · 0 评论 -
前端自动埋点
起源是在测试时候没有报错,系统功能不正常,和测试查找错误很麻烦埋点就是在某个功能函数里上报一些信息,比较类试express的中间件机制,但是没有操作的权限自定义express的打印日志中间件app.get("/", (req, res) => { // console.log(`${req.method} ${req.url} ${Date.now()}`) logger(req); res.send("index");});app.get("/about", (req, .原创 2021-06-25 14:07:51 · 576 阅读 · 0 评论 -
vue项目接口管理
这篇文章是引用的,主要是自己能够用到,方便查找,记录下具体文章链接: https://www.cnblogs.com/goloving/p/8901189.htmlvue-cli项目开发/生产环境代理实现跨域请求+webpack配置开发/生产环境的接口地址一、开发环境中跨域 使用 Vue-cli 创建的项目,开发地址是 localhost:8080,需要访问非本机上的接口http://10.1.0.34:8000/queryRole。不同域名之间的访问,需要跨域才能正确请求。跨域的方法很多,转载 2020-12-06 20:19:53 · 487 阅读 · 0 评论 -
JSDOM性能优化
测试性能JSperf使用流程使用github账号登录填写个人信息填写详细的测试用例信息(title,slug)准备填写代码(dom操作经常使用)填写必要的setup与reardown代码填写测试代码片段慎用全局变量为什么全局变量定义在全局执行上下文,是所有作用域链的顶端全局执行上下文一直存在于上下文执行栈,直到全局退出如果某个举报作用域出现了同名变量则会遮蔽或污染全局 var i,str=""; for(i=0;i<1000;i++){ str += i }原创 2020-12-06 21:10:19 · 244 阅读 · 0 评论 -
自动化构建
自动化构建重复的工作都应自动化自动化工作流:脱离运行环境兼容带来的问题,使用提高效率的语法,规范和标准ECMAScriptSASS模板引擎:增强减少重复的html都需要自动化构建工具,转义,被浏览器支持自动化的体验Sass编译yarn add scss --dev 安装sass依赖sass scss/main.sass css/style.css 编译后路径NPM Scripts 解决重复执行的命令,也是实现构建工作流最简单的方式在package.json 中添加scr原创 2020-12-15 15:08:54 · 356 阅读 · 1 评论 -
脚手架工具 及 Yeoman
概要脚手架的本质作用创建项目基础的结构,提供项目规范和约定约定:相同的组织结构相同的开发范式相同的模块依赖相同的工具配置相同的基础代码例如:IDE创建项目的过程就是一个脚手架的工作流程前端脚手架 – 独立的工具常用的脚手架工具React项目 – create-react-appVue项目 – vue-cliAngular项目 – angular-cli根据信息创建对应的项目基础结构Yeoman – 通用性项目脚手架工具,根据一套模板生成对应的脚手架项目Plop – 创建特原创 2020-12-15 15:11:54 · 203 阅读 · 0 评论 -
ESLint
规范化标准规范化是践行前端工程化中重要的一部分因为软件开发需要多人协同不同开发者代码风格不同增加项目开发成本团队需要明确同一的标准需要标准化地方代码、文档、提交日志开发中编写的代码代码标准化很重要实施方法 人为约定 工具实现Lint常见的规范化实现ESLint使用定制ESLint校验规则ESLint对TS的支持ESLint结合自动化工具或webpackESLint的衍生工具Stylelint工具的使用ESLint介绍最为主流的JS lint工具检测JS代码原创 2020-12-23 18:12:20 · 152 阅读 · 0 评论 -
Vue项目 配置本地IP
Node 读取配置新增 ip.js//build/IP.jsconst os = require('os') // Node.js 的 os 模块提供了一些基本的系统操作函数module.exports = { getIp(){ const ifaces = os.networkInterfaces() // 获得网络接口列表。 let ip = '' for(const dev in ifaces) { ifaces[dev].forEach(functi原创 2020-12-24 19:05:45 · 1107 阅读 · 1 评论 -
前端方便阅读源码 的快捷键
快速找到变量位置光标移动到 is函数,按F12或者 Ctrl + 点击鼠标左键返回之前位置ALT + 左箭头查看不同文件定义函数或者变量选中 例如.array()按F12 ,显示对应文件点击对应的标题部分,直接跳转到对应文件返回之前文件 ALT + 左键...原创 2020-12-27 17:05:54 · 161 阅读 · 0 评论 -
npm or yarn
npm or yarn前端包管理工具yarn.lock / package-lock.jsonyarn / npxyarn 可以自动找到 node_modules/.bin 下的可执行文件,npx 也可以yarn create => create-npx 可以直接执行 远端(线上)模块,一次性使用全局安装 or 本地安装全局安装模块:只有本地经常用到,而且与某一个特定项目无关的工具或者模块脚手架类型的工具,建议使用 npx / yarn create,一次性使用其他所有的原创 2021-01-06 17:53:20 · 237 阅读 · 0 评论 -
手写脚手架工具
初始化cli原创 2021-01-16 18:45:55 · 210 阅读 · 0 评论 -
vue TS项目
一 、 搭建项目架构使用vue-cli创建项目vue create edu-boss-fed使用自定义选项,选择babel,ts,route,vuex,css预处理,linter使用class风格描述组件选择ts和babel编译不选择history路由模式选择预处理器Sass,建议选择 dart-sass选择ESlint单独存放个自的配置文件进入项目中,npm run serve 启动,默认打开8080地址加入git 版本管理创建远程仓库本地代码提交远程仓库生成git本地仓原创 2021-01-26 20:05:00 · 1951 阅读 · 1 评论 -
总结 Vue 团队开发的基本配置封装
对于 vue 项目来说,很多刚入门,或者是受业务妥协的朋友大都是从百度CV 一套看得过去的架子,如常见的 D2Admin ,vue-element-admin ,进行一个二次迭代的开发,其项目本身非常的优质,而在其 template中去进行一个更改能够使得项目在一开始有一个很好的基础环境,但是如果没有花时间去琢磨透其中三分明细。在后续排雷来说,无疑是非常的困难的,因此大部分前端团队都会重构出自己的一套基础脚手架封装,有通过webpack进行处理的,也有基于VueCli打造的,最终都是自身团队的财产.原创 2021-02-06 16:30:18 · 259 阅读 · 0 评论 -
实用的Vue 自定义指令
在 Vue,除了核心功能默认内置的指令 ( v-model 和 v-show ),Vue 也允许注册自定义指令。它的作用价值在于当开发人员在某些场景下需要对普通 DOM 元素进行操作。Vue 自定义指令有全局注册和局部注册两种方式。先来看看注册全局指令的方式,通过 Vue.directive( id, [definition] ) 方式注册全局指令。然后在入口文件中进行 Vue.use() 调用。批量注册指令,新建 directives/index.js 文件import copy from '.原创 2021-02-06 16:56:10 · 195 阅读 · 0 评论 -
Vue 的前端架构
本文几乎就是一篇软件设计文档。Vue 中后台项目可能遇到的问题几乎都覆盖了,并且提供了详尽合理的解决方法1.分解需求技术栈考虑到后续招人和现有人员的技术栈,选择 Vue 作为框架。 公司主要业务是 GIS 和 BIM,通常开发一些中大型的系统,所以vue-router 和 vuex 都是必不可少的。 放弃了 Element UI 选择了 Ant Design Vue(最近Element 好像复活了,麻蛋)。 工具库选择 lodash。建立脚手架搭建 NPM 私服。使用 Node 环境开原创 2021-02-06 17:22:35 · 648 阅读 · 1 评论