生活

好久没有写一篇博客记录了,认真写一篇吧(音响放着古筝|高山流水)。转眼间,还有1个半月,我实习的旅途也就要告别一阶段了,从在校实习前,到实习后,写一写这一段的经过。那就从6月初开始写起包,一想这段经历的乌龙就感觉搞笑。6月:6月初,开始校招的阶段了,当时学校也推荐了几家企业,但是我记得有前端开发职位的,也就两家。一个叫:河北云台科技、一个叫:世纪奔腾,两个都是石家庄本地的。当时我这两个都投了,当时我们有几个人,相当于被老师内推了一把世纪奔腾,然后对面就发来了一套测试题。这个测试题就是使用element-admin这个框架,去完成两个小功能,说白了就是CRUD,然后加个分页,这个当时也完成了。因为当时在大一升大二的寒假里,我就把Vue全家桶就跟着哔哩哔哩整完了,所以这两个功能也没什么问题。但是有一个点就比较懵,这是我第一次接触Vue框架,接触后才之后听说动态路由这些概念,以前跟着哔站学,还有老师讲,我去,听都没听到过这个词汇,还有什么v-permission权限指令,当时这两个东西让我郁闷了好几天,整不明白。6月8日晚上10点左右,给企业回复了邮件,把项目地址发过去了,然后说明了一些情况,当时我们是通过邮箱进行交流的。6月9日,上午,世纪奔腾回邮件了。然后就等着消息,6月中旬前吧,13号,给我答复了。额…后面的后面,没信了,直到下一次我们在交流,是7月19日,先保密是咋回事。13号后几天,几号啊忘了,我见没有一直没有消息,我就在微信上问了一下世纪奔腾的人事,他说,这周日经理会安排什么的。然后我说行,我也就一直等着。在前面不是说有两个校招的企业吗,还有一个叫云台科技,没过几天,我也收到这个公司的面试了,约的27号还是28号,忘了,然后买了一张去石家庄的火车票,中午的时候,就开始面,当时还挺紧张的。然后那面试官就问了问意向、生活、技术类的问题,问了问原型、原型链、跨域、Cookie、Session、闭包什么常见的问题吧,回答的还行。然后当时这家公司就说,咱们前期得培训几天,然后把你们外派到其他地方去工作,如果觉得可以的话,7月4号,你们就来,我当时想的就是,反正世纪奔腾也没信了,就在这先实习着吧。当时我觉得还行,然后当天也没有回家,就在石家庄找了个宾馆,凑合了一宿,一个人20,这一晚给我难熬的啊,我的妈呀卧槽,我以后再也不住这样的了,然后后几天就一直在找房,最后在桥西找了一个,离公司得有三四公里吧,还挺远的,每天就登着个共享单车就去。7月:当时在那里,就培训一些简单的内容,在后面越来越不对劲,这个时候差不多培训了得有一个月左右的,我说怎么还不外派啊,接着让我们签合同,签一年的合同。我特么一想,我擦,这不妥妥培训班吗,我当时就开始准备跑路找下家了,当时我旁边是一个小姑娘,她也是老师忽悠来培训的吧,她基础比较薄弱,然后后来,她给我说,她一个朋友公司在招前端,问我要不要去看看,我说:去吧,试试呗。然后她就联系那个朋友,这么着我就约上面试了,这个时候已经快到7月中旬了吧,我上午,就撒谎跟云台的人撒谎请了个假,我说空调坏了,上午有师傅来修空调,然后云台人事说:行。其实我是偷偷面试去了,哈哈哈~去了之后,当时面试我的是:产品经理和一个后端,当时公司里没有前端,前端离职了。然后就问了一些我做过的项目,会啥什么的,然后着重讲的就是一些我的项目,后面我跟后端加了个微信,他让我周六过去试岗,当时去试岗的还有一个前端,我们两个前端,我跟他聊天,问他工作几年了,他一说:5年了,卧槽,感觉我自己没戏了,然后我们就各自弄着各自的东西,然后整了半天,就写出来了,然后我们呆到了下班,就回去了,说让我们等着消息。周一吧,7月18号,我当时在云台呢,然后后端给我打电话了,我去卫生间去接电话,他说,跟老板说了,老板说可以,就是实习生的身份,然后一个月两千,我说行,当时想的就是怎么着不必呆在培训班好啊,周一晚上我就跟云台人事请了个假,我说这几天有点事,我当时怕在新公司干的不好,怕人家把我辞退了,所以我也给自己留了个后路,没有给云台直接说不去了。周二上午我就去了,然后周六和我一起试岗的前端也在,这个公司现在就是我们两个前端了,当天就把合同签了,实习合同。然后就开始干呗,第一天直接上手项目就完事了!!!干着还挺好,可以适应。然后觉得啊,公司氛围挺好的。这个时候有趣的来了啊,前脚刚签完协议,后一脚,一个老师问我,最近咋样啊,我说,我逃离云台了,这就是一个培训班,我自己找了个。她问我,世纪奔腾不是一直和你联系着吗,他们对你印象挺好的啊,怎么没去啊,我说:一开始联系的挺好的,后来让我留了个电话,说后续联系我,接着就没信了,接着,我收到了这样的一封邮件。收到这封邮件的时候,很让我哭笑不得,但是我又想不明白,世纪奔腾是真正弄错了呢,还是碍于老师的面子,所以才又回复了我一下呢?8月:8月就一直做刚刚来公司的那个项目,应该就是这个月上线的吧,这是我第一次经历项目上线,虽然……后面让这个项目给我整得不想干了。因为这个项目是一个PC端的吗,所以公司也想弄一个小程序,然后老板把这个小程序先外包给了北京的一个人,它用的Taro框架,使用的Vue语法。我一想这个小程序我就生气,当然了,这个小程序也深深的给我上了一课。我他么就艹了,使用Taro框架然后加Vue语法,给元素绑定个点击事件,点击一下特么执行好几次。然后我当时也稀里糊涂的就那么干着,不得不提,产品的原型画的是真几把操蛋啊卧槽,真的操蛋。后来就整,小程序就整完了,当时也没要求上线,就一直保存着,然后PC端就一直迭代,当时也没管小程序,导致小程序丢了丢下了好几个版本。后来因为这个苹乐的项目因为用友U8的一些原因,导致停了一段时间。然后公司开始整新项目,叫做“庄里婚车”,是一个小程序,现在还可以搜到,但是没有运营起来。这个项目就一直是我负责的,感觉就很操蛋,没有明确的目标,而且公司有三个老板,每个老板的意见都不同,整得都不知道咋去开发。不管怎么说,最后还是整完了,这个都没运行起来呢,又开始一个叫“庄里洗车”的项目,我的妈呀,还有一个叫做“奕打卡”的项目。说实话,有的项目就等于是:管理层还没策划好呢,已经开始敲代码了,到最后就改来改去的,烦得不行。实习公司的组织架构:期间有一次差点给我干离职了我擦,讲一讲这个公司的组织架构吧。公司主要有三个老板,大老板和三老板是搞建筑的,二老板才是搞IT的,以前是百度的。最让我恶心的就是,公司差不多全是摸鱼的,然后前端不就负责展示嘛,小程序就全部都是我负责。然后那俩搞建筑的老板就每次都问我进度咋这么慢,我也不好意思说他们摸鱼啥的,我就嗯嗯嗯,他妈的,然后有一次他就一直一直说,气得我,我心想,妈的,下班就不干了。然后我就想着,要是不干了,我找实习的话,还得延期半年毕业,然后晚上我就又当懦夫了,第二天又上班去了。10月:时间直接跳到10月吧,这个时候要引出一个人来了,就是14楼(一个公司哈,简称),他们公司和我们公司应该是有合作。当时14楼就有一个XX(哒咩泄密)的项目,交给我们公司做了,但是可能是我们公司不太看好这个项目,所以就一直拖着,也没什么进度,一直拿着假数据糊弄着人家14楼。到最后,我们公司的人们,就不原意在这个公司干了,一个是因为老是拖着工资,其实拖也拖不了多长时间,还有就是感觉这个公司没有目标,太懒散。这个时候,我们公司的三个老板去上海谈项目去了,去的时间不短,这个时候,14楼的那个老总就一直上来,来我们公司办公。当时我们公司老板让它负责管理公司,但是它给我们洗脑,说是以后的工资它来给我们发什么的,到最后我们公司的人就全部信它了,就相当于背叛我们原来这个公司了,然后我们老板跟14楼那个老板关系也不是很好了。最后的结果就是:我们公司的人,全部下去14楼办公了,就只负责干那个(哒咩泄露)的项目,在两个公司谈好我们要下去之后,我就突然不想干了,感觉14楼那个老板靠不住,我跟21楼的老板说,我说辞职,然后谈了一番,当天晚上我就辞职了。10月20号左右我就辞职了,然后我当时就在租的房子里,过的那叫一个苦啊卧槽,因为当时9月份的工资,还没有发,我就天天馒头卷酱,三种酱(香菇、豆瓣、牛肉->不好吃|辣),混着吃,有时候就出去,去对面吃碗重庆小面(超级好吃)。这几天我就在家深造,学习TypeScript,打算学学新技术在出去找个面试吧,然后31号晚上吧,14楼给我打电话,说让我回去把小程序交接完,不然9月份的工资可能就不发了(14楼不发),让我去找21楼要,我当时就他妈的草了14楼的大爷了,妈的。我当时气不过,我说不发就不发,不发我就起诉,然后我那个同事就又给我打电话,劝我,让我去,去一天挣一天的钱,后来我就说行。11月:11月,我回到了14楼。然后我就回去了,回去之后,我就说,我要重新写小程序,一个星期写完,他说行,然后我就用UniApp框架重写。写完后,14楼老板的意思是把我留在公司,然后给我涨两千工资,我也答应了,然后我就参与了那个(哒咩)项目。但是这个乌龟老王八蛋,他妈的一直拖欠着工资,整得9月份10月份的工资,现在都还没发,所以我们现在罢工了。然后11月又赶上石家庄又封起来了,所以这一段时间相对过的还是比较自由的,在家里接接单子,每天整个一二百。接下来等解封之后,不打算在继续干了,想着包装一下自己,多面面试,面过了也不入职,增加增加面试经验。

2022-12-1 36 0
2022-9-21 163 0
Vue

今天在项目开发时,由于素材都是存在本地了,然后还没压缩,导致小程序项目超出了2MB,然后无法编译了,就了解了一下分包,在采取分包后,顺利解决!本篇文章中,小程序采用的是Uniapp框架,和原生小程序中的分包流程相同,只不过无需修改manifest.json文件。分包简介在微信小程序中,默认只有一个主包,在项目打包时,所有的资源(页面及资源等)都被放到了主包中。造成的问题:在小程序中,主包的体积最大只可以达到2MB,如果超出了2MB,则不通过了。对于以上的问题,可以采取分包,分包就相当于将指定的页面及资源,单独放在一个包中,不在放到主包中,从而减少主包的体积。分包的上限及条件:开发者可以分N个包,但是要求每个包不允许超过2MB,整个小程序所有分包大小不能超过20MB。分包的好处:主包中一般存放的都是Tabbar页面,如果将非Tabbar页面从主包中移除,则可以加快加载速度。分包中的内容,默认不加载,只有需要用到它时,再去现场加载,当然,可以通过分包预下载去提前加载分包中的内容。使用分包-uniapp注意:如果是Tabbar页面,或者是多个分包需要用到的公共资源,请放到主包中。分包可以访问主包中的资源,而主包不允许访问分包中的资源。假设:现在有一个用户端[公共的],一个管理端[需要权限],我们可以将用户端放到主包中,将管理端的内容分成一个包。因为用户在进入小程序时,默认进入的都是用户端,没必要将管理端的资源也加载上,只有当拥有权限并且在切换到管理端时,我们在去加载管理端的内容。//当前文件结构树[未分包],默认都存放到pages中,当分包后,pages中的内容就是主包的内容。pages:|-...//假设用户端页面有N个,这里就不写了|-backStage/index/index.vue:管理端首页|-backStage/xxxxx/index.vue:管理端第二页/*分包准备:1.新建一个文件夹,和pages同级,*每个文件夹相当于一个分包*,并将静态资源命名为static然后放到分包的根目录下。2.在该分包下新建一个pages文件夹,该文件夹中存储页面文件夹。3.然后将分包中的内容,从主包中移走。*///主包pages:|-...//用户端的内容//管理端分包backStagePackage:|-pages:管理端页面|-index/index.vue:管理端首页|-xxxxx/index.vue:管理端第二页|-static:静态资源然后打开manifest.json文件,在mp-weixin节点中的根节点下,添加配置:"optimization":{"subPackages":true}接着打开pages.json配置分包:在和pages同级节点下,添加subPackages字段,值为数组,它用于配置分包。它的每一个元素是一个对象,每个元素及为一个分包。使用管理端分包为例,首先在数组中添加一个对象,对象中拥有:root,pages,name,independent字段。root属性:它的值为分包文件夹的名称,即:backStagePackage。pages属性:它的值为一个数组,每一个元素填写分包中的页面路径即可(不需要加上分包名)。name属性:分包别名,分包预下载时可以使用。independent属性:是否开启独立分包,默认不开启(false)。"subPackages":[{"root":"backStagePackage","pages":["pages/index/index","pages/xxxxx/index"]}]

2022-7-14 213 0
TypeScript

常用编译选项该选项全部都是compilerOption配置中的选项。allowJs:说明:在编译时,默认编译的全是.ts文件,然后在编译输出的文件夹中,存放的只是被编译的.ts转.js文件。例如:在上图中,src中存在index.js文件,我们也需要将该文件进行编译,然后让它也输出的被编译的build文件中。只需要将allowJs设置为true即可。checkJs:说明:将allowJs打开后,如果js文件中的类型设置错误了,默认是不进行提示的,而将checkJS选项设置为true后,在编译js文件时,也会对js文件进行编译检查。removeComments:说明:当为该选项设置成true时,在编译时,将被编译文件中的注释给删除掉。noEmit:说明:在编译时,只进行编译语法检查,不生成编译后的.js文件。noEmitOnError:说明:在编译时,如果存在错误,不生成编译后的.js文件,只有没有错误时,才会生成编译后的js。alwayStript:说明:它的默认值是一个true,当为true时,被编译生成的文件,都是严格模式的.js文件。当为false时,则关闭严格模式。script:说明:它是类型检查的总开关,如果将该选项置为false,则可以根据自己去打开某个具体的子选项。noImplicitAny:说明:当打开该选项时,如果有隐式的any则会报错,必须声明any或者其他类型。//如果不对a和b进行声明类型,那么它就是一个隐式的any,则会报错,我们必须需要对它声明类型,哪怕是any。functionadd(a,b){returna+b;}strictNullChecks:说明:检查null和undefined,如果该值为null或undefined,则不允许去调用其他内容。//假设页面上现在没有a标签leta=document.querySelector('a');console.log(a.style);//由于a是null,所以此时会报错。

2022-7-12 160 0
TypeScript

TypeScript是JavaScript的一个超集,优化了JavaScript中没有静态类型的缺点。并且在编译时,可以发现一些错误,在vscode中,当出错时,未当编译时就会出现红色波浪线。1.安装提示:在安装TypeScript之前,需要先安装Node.npminstall-gtypescript当安装之后,全局中则多了一个tsc命令。2.编写及编译在安装TypeScript之后,我们则可以创建以.ts为后缀的文件了,以.ts为后缀的文件,里面就是TypeScript代码。当TypeScript文件中的代码写完之后,我们需要对它进行编译成JavaScript文件,就像Java一样,需要将.java文件编译成.class。需要在终端中执行以下命令,进行编译。tsc文件名.ts当执行完以下命令后,则生成了一个编译好的.js文件。vscode报错问题:在vscode中,如果不生成tsconfig.json配置文件,在编译TypeScript生成JavaScript文件后,就会报重复定义的错误。解决办法:只需要生成一下该文件即可[无论是用tsc命令生成,还是手动创建一个tsconfig.json文件]。3.编译错误在编译的过程中,会检查你编写的TypeScript代码有没有问题,如果出现了问题,那么在终端中则会显示哪里出现了问题。但是,它并不会影响生成JavaScript文件,就算编译时出现了错误,它依旧会生成JavaScript文件。我们可以在tsconfig.json中把noEmitOnError这个选项解开注释使其生效,这样当TypeScript编译错误时,就不会在生成JavaScript文件了。4.tsc命令1.编译某个文件tsc文件名.ts2.监听某个文件,变化时自动编译tsc文件名.ts--wach3.一次性编译所有文件tsc4.监听所有文件的变化,变化时自动编译tsc--watch5.生成配置文件tsc--init5.配置文件我们可以通过tsc--init命令去生成一个配置文件,在终端运行以下命令。tsc--init当运行完如上命令后,在文件夹中则会生成一个tsconfig.json文件夹。该文件中,存储的都是配置选项,noEmitOnError选项就在其中[TypeScript编译错误时不生成JavaScript]。在该JSON文件中,是可以写注释的,并且它一共有5个大选项。compilerOptions:编译选项,生成配置文件时默认就带该选项。files:单独需要编译的文件,此次编译只会编译里面的文件。include:指定文件夹,此次编译文件夹中的文件。exclude:不编译该文件夹中的内容,默认值为:node_modules…extends:表示继承的其他配置文件。“compilerOptions”说明:编译选项.target:说明:将TypeScript编译成ECMAScript哪个版本?"compilerOptions":{"target":"es2015"或者"target":"es6"}outDir:说明:默认情况下,是将编译后的.js文件放到根目录的,我们可以通过该选项去指定编译生成的.js文件放到哪个位置。假如main.ts放在了src目录下,并且将outDir设置成了./js,那么编译后,这个被编译生成的main.js是放在./js/src/main.js中的。"compilerOptions":{"outDir":"./js"}module:说明:该选项可以选择模块化系统。可选值:CommonJS【require】、Es6【import】、UMD、AMD、System、ES2020、ESNext."compilerOptions":{"module":"CommonJS"}“files”说明:如果在该数组中指定了文件路径,那么此次编译就只会编译元素中的文件。提示:该选项的元素中,只能指定一个单独的.ts文件,不能指定文件夹。"files":["./src/index.ts"]“extends”说明:继承其他配置文件的配置。"extends":"./src/tsconfig.json"“include”说明:每个元素的内容为一个文件夹地址,编译时会编译文件夹中的文件。提示:可以选择通配符,详情看代码注释。"include":[//编译src文件夹下的,所有文件夹[**]中的所有文件[*]"./src/**/*"]“exclude”说明:数组每个元素是一个地址,对这些元素中的地址不进行编译。默认值:node_module…"exclude":["..."]

2022-7-10 162 0
2022-6-12 259 0
Vue

1.优化前先分析依赖//首先安装依赖npminstallwebpack-bundle-analyzer--save-dev//然后在vue.config.js中进行引入constBundleAnalyzerPlugin=require('webpack-bundle-analyzer').BundleAnalyzerPlugin;//然后添加如下代码configureWebpack:{plugins:[newBundleAnalyzerPlugin({analyzerMode:'server',analyzerHost:'127.0.0.1',analyzerPort:8888,reportFilename:'report.html',defaultSizes:'parsed',openAnalyzer:true,generateStatsFile:false,statsFilename:'stats.json',statsOptions:null,logLevel:'info'}),]}当打包或者运行时,会在本地8888端口展示依赖情况,然后自行分析。2.采用路由懒加载在写路由时,不要将所有的组件都一下加载全,应该使用import()进行懒加载。这样只有当访问这个路由时,才会加载对应的模块。cosntroutes=[{path:"/home",component:()=>import('@/view/Home')//使用import进行懒加载}];3.进行GZIP压缩需要在Webpack中构建gz文件,然后在Nginx中启用gzip。//首先安装依赖npminstallcompression-webpack-plugin@1.1.12//然后在vue.config.js中进行引入constCompressionWebpackPlugin=require('compression-webpack-plugin');//然后添加以下代码configureWebpack:{plugins:[newCompressionWebpackPlugin({filename:'[path].gz[query]',algorithm:'gzip',test:/\.js$|\.json$|\.css/,threshold:10240,//只有大小大于该值的资源会被处理minRatio:0.8,//只有压缩率小于这个值的资源才会被处理})]}然后在Nginx中进行以下配置,启用GZIP。#开启gzip。gzipon;#开启后如果能找到.gz文件,直接返回该文件,不会启用服务端压缩。gzip_staticon;#文件大于指定size才压缩,以kb为单位。gzip_min_length1;#用于识别http协议的版本,早期的浏览器不支持gzip压缩,用户会看到乱码,所以为了持前期版本加了此选项,目前此项基本可以忽略gzip_http_version1.1;#压缩级别,1-9,值越大压缩比越大,但更加占用CPU,且压缩效率越来越低。gzip_comp_level9;#压缩的文件类型。gzip_typestext/cssapplication/javascriptapplication/json;使用CDN引入资源在打包时,会将import导入的东西,打包成js文件,然后该文件就会很大.如果我们的服务器带宽很小,那么还要加载这些资源就很慢,这样的话我们可以使用cdn的方式,去让用户请求其他服务器获取资源。我们需要在index.html中进行使用link或者script标签的方式去引入对应的资源。然后在vue.config.js中进行配置。//Key:和package中的名称一样,value:全局变量名//一定要将Vue引入[通过cdn,也要在这里进行配置],因为有些文件依赖着它。configureWebpack:{externals:{'vue':"Vue",'element-ui':"ELEMENT",'axios':'axios','jquery':'$','vue-router':'VueRouter','vuex':'Vuex'}}

2022-5-30 248 0
2022-5-28 199 0