我的GitHub
0%

创建项目

1.使用脚手架正常创建项目

1
vue create hello-world

2.集成electron

1
vue add vue-cli-plugin-electron-builder

不过这一步可能大多数同学可能卡在下载electron这,因为众所周知的原因,它需要很久

因此我们推荐使用国内源加速

1
npx cross-env ELECTRON_MIRROR="https://npm.taobao.org/mirrors/electron/" vue add vue-cli-plugin-electron-builder

这种方式能有效加速你的集成

也可以创建.npmrc文件放在项目中

阅读全文 »

sequelize引入

1
2
npm i mysql2
npm i egg-sequelize

sequelize配置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
// 不同环境的库当然不一样,自己配置多环境的config.xx.js,我这就写个default
// ./config/config.default.js
// sql配置,填自己的即可
config.sequelize = {
dialect: 'mysql',
host: '127.0.0.1',
port: 3306,
database: 'monitor',
username: 'root',
password: '123456',
define: { // model的全局配置
timestamps: true, // 添加create,update,delete时间戳
paranoid: true, // 添加软删除
freezeTableName: true, // 防止修改表名为复数
underscored: true, // 使用下划线
},
timezone: '+8:00', // 由于orm用的UTC时间,这里必须加上东八区,否则取出来的时间相差8小时
dialectOptions: { // 让读取date类型数据时返回字符串而不是UTC时间
dateStrings: true,
typeCast(field, next) {
if (field.type === 'DATETIME') {
return field.string();
}
return next();
},
},
};

插件配置

开启sequelize插件

./config/plugin.js

1
2
3
4
5
6
7
8
9
10
11
12
'use strict';


/** @type Egg.EggPlugin */
module.exports = {
// xxxxxx
sequelize: {
enable: true,
package: 'egg-sequelize',
},
};

用法

和正常的sequelize相似

阅读全文 »

日志涉及的东西还是挺多的

一.日志格式化

默认是自带格式的,但保不齐自己有自定义格式的需求.因此需要修改格式.

1
2
3
4
5
6
7
8
9
// ./config/config.default.js
......
config.logger = {
dir: path.join(__dirname, '../logs'),
contextFormatter(meta) {
//TODO:这里就是默认loger返回的日志格式了
return `${meta.date} ${meta.message}`;
},
};

二.自定义存储路径

u1s1,你会发现本地运行的时候,产生的loger在项目文件夹下,但在部署的时候就找不到了.

因为在egg默认的生产环境中,会在用户根目录下,新建一个叫logs的文件夹,所有日志都在里面.

因此需要自定义日志地址

1
2
3
4
5
6
7
8
9
10
// ./config/config.default.js
......
config.logger = {
//这里写日志地址,__dirname可以变成别的
//但是注意,appInfo.root在生产和开发不是一个地址,建议使用appInfo.baseDir
dir: path.join(__dirname, '../logs'),
contextFormatter(meta) {
return `${meta.date} ${meta.message}`;
},
};

三.自定义logger

阅读全文 »

流程图

流程图

概念

房间号:房间号是基于声网appid命名空间的,同一个appid下的房间号如果存在会加入,不存在则直接创建

uid:可使用下面的组件中提供的组件中的utils获取,本质是基于时间生成的各不相同,也可以根据我们的业务自定义产生,比如直接使用用户id

集成

组件下载地址
集成步骤可查看readme

注意事项

微信基础库 1.7.0 开始支持,低版本需做兼容处理。

微信需要配置域名

阅读全文 »

homebrew不多说,java8也不多说。
brew安装不上java8的例子太多了。
最后的做法无非这么几个,安装openjdk版本,或者安装其他的版本,或者直接去官网装。

我今天就要硬装!就要用brew硬装官网版本的java8!

一.安装报错

1
brew cask install homebrew/cask-versions/java8

执行这个,然后肯定报错
1.png

1
Error: Cask 'java8' is unavailable: '/usr/local/Homebrew/Library/Taps/homebrew/homebrew-cask-versions/Casks/java8.rb' does not exist.

也就是这个玩意

二.添加java8.rb

注意到上面报错的地址了没,说的是你文件夹下没有java8.rb这个文件

让我们打开github之这个老姐删掉了java8.rb

阅读全文 »

先说点老生常谈的问题

啥是跨域

1.同源策略

要了解跨域,先要说说同源策略。同源策略是由 Netscape 公司提出的一个著名的安全策略,所有支持 JavaScript 的浏览器都会使用这个策略。所谓同源是指,域名,协议,端口相同。当页面在执行一个脚本时会检查访问的资源是否同源,如果非同源,那么在请求数据时,浏览器会在控制台中报一个异常,提示拒绝访问。

同源策略一般又分为以下两种:

DOM同源策略:禁止对不同源页面DOM进行操作。这里主要场景是iframe跨域的情况,不同域名的iframe是限制互相访问的。XmlHttpRequest同源策略:禁止使用XHR对象向不同源的服务器地址发起HTTP请求。

2.什么是跨域?

跨域,指的是从一个域名去请求另外一个域名的资源。即跨域名请求!跨域时,浏览器不能执行其他域名网站的脚本,是由浏览器的同源策略造成的,是浏览器施加的安全限制。

跨域的严格一点来说就是只要协议,域名,端口有任何一个的不同,就被当作是跨域。

好了,我们得出结论:1.跨域只在浏览器中会出现2.协议,域名,端口任一不同就会出现跨域

阅读全文 »

背景

线上报错,啥也不知道,无法复现束手无策,客户开喷,研发背锅

这种事情,u1s1,大家都遇到过吧

解决方式就是有个日志收集上报的地方去查,查什么时候,什么时间,什么环境,出了什么错误,在某些程度能不那么被动

选型

是不是以为我是要说用哪家,实际上是准备自己写。。

免费的不放心,付费的买不起
但这里还是列出几家
fundebug
sentry

怎么做?

1.了解需要采集的指标
2.收集的方式
3.上报的方式
4.上报的时机
5.如何解析
6.告警

1.了解需要采集的数据指标

阅读全文 »

为什么要引入

一开始我想的是,可能多人多项目开发,把组件展示出来,避免重复造轮子

但后来想想,好像除了展示,没什么其他用处

两个项目如果要用同一个样式的组件,如果没有单独抽出组件库,还是得复制粘贴,用处不大

只能说做组件库的同学用这个比较好用。

还有一个自动化测试的好处(不过我从来没写过测试,暂时还无法体会这个好处)

还有其他用处的话,麻烦老哥们留言区告诉我

如何引入

1
2
cd 项目目录下
npx -p @storybook/cli sb init

会拉一些依赖,并新建两个文件夹

阅读全文 »

其实标题起的有点大,主要是使用shell中的&和wait这两个命令。

运维大佬不要嘲笑。

无星的前端之旅(四)——小程序持续集成前面介绍了背景,我们有一套代码要发40多个客户的小程序主体。

在Jenkins中加shell去完成上传开发版这个操作。但是需要进行多参数化配置,换句话说就是40多家客户我们要打40多个包,分别上传。

shell的执行方式是,前面执行完了,我们才能执行下一个命令。

因此如果我们打一个包并上传的时间是1分钟,那40家就是40分钟。这谁顶得住啊。

所以需要考虑如何压缩这个打包上传时间,能不能同时打包,同时上传。

原本的shell如下,变量我就写中文代替了

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
function npminstall(){
echo "拉依赖"
cd 代码文件夹下
npm install
}
function buildwx(){
echo "执行构建"
# echo '环境:'$1
# echo '文件名:'$2
# echo '客户名:'$3
npx cross-env 环境=$1 文件名=$2 客户名=$3 node build/build.js wx
}
function upload(){
echo "执行上传"
# echo '文件名:'$1
# echo 'appid:'$2
# echo 'version:'$3
npx miniprogram-ci upload --pp ./dist/${1}/wx --pkp ./privatekey/private.${2}.key --appid ${2} --uv ${3} -r 1 --enable-es6 true
}
#------------------待构建配置------------------
configs=(
"xxx客户;xxx环境;xxx文件名;xxxxappid"
"xxx客户;xxx环境;xxx文件名;xxxxappid"
)
##读取version变量
version=‘xxx文件读取’
#------------------执行批量构建------------------
npminstall
for xxx in ${configs[@]};do
客户名=`echo ${xxx} | awk -F ";" '{print $1}'`
环境=`echo ${xxx} | awk -F ";" '{print $2}'`
文件名=`echo ${xxx} | awk -F ";" '{print $3}'`
appid=`echo ${xxx} | awk -F ";" '{print $4}'`
buildwx ${环境} ${文件名} ${客户名}
upload ${文件名} ${appid} ${version}
echo "$客户名 上传完毕"
done

就是一个简单的for循环,根据配置信息批量打包。40多家就是40分钟。

阅读全文 »