BlueXIII's Blog

简介

NG-ALAIN是一个企业级中后台前端/设计解决方案脚手架。
技术栈基于Typescript、Angular、g2、@delon和ng-zorro-antd。

官网文档

• ng-alain
• ng-alain 组件
• ng-alain CLI
• ng-alain Mock
• ng-alain Util
• ng-zorro
• ng-zorro Icon

其它

• AntDesign介绍
• 博客及网站

新建脚手架

CLI方式脚手架

使用CLI安装，是一个干净的脚手架

1
2
3
4

ng new alian-demo --style less
cd my-project
ng add ng-alain
npm start

克隆方式脚手架

使用克隆代码会包含所有示例

1
2
3
4

git clone --depth=1 https://github.com/ng-alain/ng-alain.git alain-demo
cd alain-demo
yarn
npm start

启动

1

npm start

脚手架

以克隆方式创建工程，包含众多示例，直接参考源码即可

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

├── _mock                                       # Mock 数据规则
├── src
│   ├── app
│   │   ├── core                                # 核心模块
│   │   │   ├── i18n
│   │   │   ├── net
│   │   │   │   └── default.interceptor.ts      # 默认HTTP拦截器
│   │   │   ├── services
│   │   │   │   └── startup.service.ts          # 初始化项目配置
│   │   │   └── core.module.ts                  # 核心模块文件
│   │   ├── layout                              # 通用布局
│   │   ├── routes
│   │   │   ├── **                              # 业务目录
│   │   │   ├── routes.module.ts                # 业务路由模块
│   │   │   └── routes-routing.module.ts        # 业务路由注册口
│   │   ├── shared                              # 共享模块
│   │   │   └── shared.module.ts                # 共享模块文件
│   │   ├── app.component.ts                    # 根组件
│   │   └── app.module.ts                       # 根模块
│   │   └── delon.module.ts                     # @delon模块导入
│   ├── assets                                  # 本地静态资源
│   ├── environments                            # 环境变量配置
│   ├── styles                                  # 样式目录
└── └── style.less                              # 样式引导入口

开发

启动流程

当通过 ng serve 运行应用后，一个完整的 Angular 启动流程大概是这样：

1. 触发APP_INITIALIZER（脚手架具体实现在 StartupService.load） 获取应用信息
2. 触发业务路由（脚手架的 src/app/routes/routes-routing.module.ts）
3. 渲染组件

APP_INITIALIZER:
NG-ALAIN始终认为在Angular启动之前需要一次网络请求来获取一些应用信息（例如：菜单数据、用户数据等），具体实现细节startup.service.ts；它返回的是一个 Promise 对象，不管怎么样始终都需要调用：resolve() 才能确保 Angular 正常启动。

业务路由:
脚手架顶层路由从 routes-routing.module.ts 开始

新增模块

1

ng g ng-alain:module sys

新增页面

1

ng g ng-alain:list log -m=sys

新增业务组件

对于一些可能被多处引用的功能模块，建议提炼成业务组件统一管理。这些组件一般有以下特征：

• 只负责一块相对独立，稳定的功能；
• 没有单独的路由配置；
• 可能是纯静态的，仅受父组件（通常是一个页面）传递的参数控制。

在src/app/shared/components下新建一个以组件名命名的文件夹，命名尽量体现组件的功能。

index.ts

1
2
3
4
5
6
7
8
9

// main.component.ts
export class MainComponent {}

// sub.component.ts
export class SubComponent {}

// index.ts
export MainComponent from './main.component';
export SubComponent from './sub.component';

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

// index.ts
import { Component, Input } from '@angular/core';

@Component({
  selector: 'image-wrapper',
  template: `
    <div [ngStyle]="style">
      <img class="img" [src]="src" [alt]="desc" />
      <div *ngIf="desc" class="desc">{{ desc }}</div>
    </div>
  `,
  styleUrls: [ './index.less' ]
})
export class ImageWrapperComponent {
  @Input() style: { [key: string]: string };
  @Input() src: string;
  @Input() desc: string;
}

注册:

1
2
3
4
5
6
7
8
9

// shared.module.ts

// #region your componets & directives
import { ImageWrapperComponent } from './image-wrapper';
const COMPONENTS = [
  ImageWrapperComponent
];
const DIRECTIVES = [];
// #endregion

使用:

1
2
3

<image-wrapper
  src="https://os.alipayobjects.com/rmsportal/mgesTPFxodmIwpi.png"
  desc="示意图"></image-wrapper>

HTTP

在 NG-ALAIN 中，一个完整的前端 UI 交互到服务端处理流程是这样的：

• 首次启动 Angular 执行 APP_INITIALIZER；
• UI 组件交互操作；
• 使用封装的 _HttpClient 发送请求；
• 触发用户认证拦截器 @delon/auth，统一加入 token 参数；
• 若未存在 token 或已过期中断后续请求，直接跳转至登录页；
• 触发默认拦截器，统一处理前缀等信息；
• 获取服务端返回；
• 触发默认拦截器，统一处理请求异常、业务异常等；
• 数据更新，并刷新 UI。

拦截器:
默认情况下在根模块注册了两个拦截器 SimpleInterceptor 和 DefaultInterceptor，且执行顺序按注册顺序执行。

开发环境:
正常情况下开发环境和生产环境不是同一个后端请求源，实际可以通过配置 environment 目录下 environment.ts 和 environment.prod.ts 改变不同环境的请求源。

Mock:
利用@delon/mock来模拟请求数据，可以在_mock目录下创建相应的Mock接口

注意，mock对外不暴露http服务

1
2
3

export const USERS = {
  'GET /users': { users: [1, 2], total: 2 }
}

引入Angular组件

安装依赖包:

1

yarn add ngx-tinymce

在SharedModule模块中导入和导出:

1
2
3
4

// #region third libs
import { NgxTinymceModule } from 'ngx-tinymce';
const THIRDMODULES = [ NgxTinymceModule ];
// #endregion

对于部分第三方组件，可能会需要一些配置项，建议在根模块中注册，例如：

1
2
3
4
5
6
7
8
9

import { NgxTinymceModule } from 'ngx-tinymce';
@NgModule({
  imports: [
    BrowserModule,
    NgxTinymceModule.forRoot({
      baseURL: '//cdn.bootcss.com/tinymce/4.7.13/'
    })
  ]
})

引入非Angular组件

1

yarn add qrious

在angular.json找到scripts节点并增加

1
2
3

"scripts": [
  "node_modules/qrious/dist/qrious.min.js"
]

构建

1

npm run build

环境变量:
通过 src/environments 文件夹根据不同环境配置相应的参数，配置项同时也可以在应用当中直接调用它们。同时，还需要配置 angular.json 内的配置项，最后你可以透过命令改变环境配置。

分析构建文件体积:

1

npm run analyze

NgZorro

官网

• https://ng.ant.design/components/icon/zh
• https://github.com/NG-ZORRO/ng-zorro-antd

教程

• https://github.com/NG-ZORRO/today-ng-steps

图标

https://ng.ant.design/components/icon/zh

栅格

https://ng.ant.design/components/grid/zh

表单

https://ng.ant.design/components/form/zh

参考文档

• https://less.bootcss.com/
• https://juejin.im/post/5a2bc28f6fb9a044fe464b19
• https://www.jianshu.com/p/c84038863097
• https://www.jianshu.com/p/61c793799cad

对比

• SASS: Sass (Syntactically Awesome Stylesheets)是一种动态样式语言，Sass语法属于缩排语法，比css比多出好些功能(如变量、嵌套、运算,混入(Mixin)、继承、颜色处理，函数等)，更容易阅读。from 2007
• SCSS: Sass的缩排语法，对于写惯css前端的web开发者来说很不直观，也不能将css代码加入到Sass里面，因此sass语法进行了改良，Sass 3就变成了Scss(sassy css)。与原来的语法兼容，只是用{}取代了原来的缩进。
• LESS: Less也是一种动态样式语言. 对CSS赋予了动态语言的特性，如变量，继承，运算， 函数.  Less 既可以在客户端上运行 (支持IE 6+, Webkit, Firefox)，也可在服务端运行 (借助 Node.js)。 from 2009

使用Less

页面引入

1
2

<link rel="stylesheet/less" href="style.less">
<script src="less.min.js"></script>

使用npm安装

1
2

npm install -g less
lessc styles.less > styles.css

导入（Importing）

1
2

@import "library"; // library.less
@import "typo.css";

嵌套（Nesting）

1
2
3
4
5
6
7
8
9

#header {
  color: black;
  .navigation {
    font-size: 12px;
  }
  .logo {
    width: 300px;
  }
}

变量（Variables）

值变量

1
2
3
4
5
6
7

@width: 10px;
@height: @width + 10px;

#header {
  width: @width;
  height: @height;
}

选择器变量

1
2
3
4
5
6
7
8
9
10
11
12

@mySelector: #wrap;
@Wrap: wrap;
@{mySelector}{ //变量名 必须使用大括号包裹
  color: #999;
  width: 50%;
}
.@{Wrap}{
  color:#ccc;
}
#@{Wrap}{
  color:#666;
}

属性变量

1
2
3
4
5

@borderStyle: border-style;
@Soild:solid;
#wrap {
  @{borderStyle}: @Soild;//变量名 必须使用大括号包裹
}

url变量

1
2
3
4

@images: "../img";//需要加引号
body {
  background: url("@{images}/dog.png");//变量名 必须使用大括号包裹
}

声明变量

1
2
3
4
5
6
7
8
9
10
11
12

@background: {background:red;};
#main{
    @background();
}
@Rules:{
    width: 200px;
    height: 200px;
    border: solid 1px red;
};
#con{
  @Rules();
}

变量运算

1
2
3
4
5
6
7
8
9

@width:300px;
@color:#222;
#wrap{
  width:@width-20;
  height:@width-20*5;
  margin:(@width-20)*5;
  color:@color*2;
  background-color:@color + #111;
}

变量作用域（Scope）

1
2
3
4
5
6
7
8

var: red;

#page {
  @var: white;
  #header {
    color: @var; // white
  }
}

媒体查询

1
2
3
4
5
6
7
8
9
10
11
12

.component {
  width: 300px;
  @media (min-width: 768px) {
    width: 600px;
    @media  (min-resolution: 192dpi) {
      background-image: url(/img/retina2x.png);
    }
  }
  @media (min-width: 1280px) {
    width: 800px;
  }
}

混合（Mixins）

1
2
3
4
5
6
7
8
9
10
11
12
13
14

.bordered {
  border-top: dotted 1px black;
  border-bottom: solid 2px black;
}

#menu a {
  color: #111;
  .bordered();
}

.post a {
  color: red;
  .bordered();
}

运算（Operations）

1
2
3
4
5
6
7
8
9
10
11

// 所有操作数被转换成相同的单位
@conversion-1: 5cm + 10mm; // 结果是 6cm
@conversion-2: 2 - 3cm - 5mm; // 结果是 -1.5cm

// conversion is impossible
@incompatible-units: 2 + 5px - 3cm; // 结果是 4px

// example with variables
@base: 5%;
@filler: @base * 2; // 结果是 10%
@other: @base + @filler; // 结果是 15%

为了与 CSS 保持兼容，calc() 并不对数学表达式进行计算，但是在嵌套函数中会计算变量和数学公式的值。

1
2

@var: 50vh/2;
width: calc(50% + (@var - 20px));  // 结果是 calc(50% + (25vh - 20px))

转义（Escaping）

转义（Escaping）允许你使用任意字符串作为属性或变量值。任何 ~”anything” 或 ~’anything’ 形式的内容都将按原样输出

1
2
3
4
5
6

@min768: ~"(min-width: 768px)";
.element {
  @media @min768 {
    font-size: 1.2rem;
  }
}

函数（Functions）

1
2
3
4
5
6
7
8

@base: #f04615;
@width: 0.5;

.class {
  width: percentage(@width); // returns `50%`
  color: saturate(@base, 5%);
  background-color: spin(lighten(@base, 25%), 8);
}

命名空间和访问符

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

bundle() {
  .button {
    display: block;
    border: 1px solid black;
    background-color: grey;
    &:hover {
      background-color: white;
    }
  }
  .tab { ... }
  .citation { ... }
}

#header a {
  color: orange;
  #bundle.button();  // 还可以书写为 #bundle > .button 形式
}

映射（Maps）

1
2
3
4
5
6
7
8
9

#colors() {
  primary: blue;
  secondary: green;
}

.button {
  color: #colors[primary];
  border: 1px solid #colors[secondary];
}

注释（Comments）

1
2
3
4
5
6

/* 一个块注释
 * style comment! */
@var: red;

// 这一行被注释掉了！
@var: white;

参考资料

官网

• angular.io
• angular.cn
• 版本号

书籍

• Angular从零到一

教程

• angular-cli指南
• NG组件样式
• flex
• yarn
• flex

其它

• playground

开发环境

检查node及npm环境

1
2

node -v #>10.9.0, v12.12.0
npm -v #6.13.4

安装angular-cli

卸载

1
2
3

ng -v  # 6.0.8
npm uninstall -g @angular/cli 
npm cache clean --force

安装

1
2

npm install -g @angular/cli@6.0.3   #指定版本
npm install -g @angular/cli@latest  #最新版本9.0.3，向下兼容

命名规则

• 文件名采用 feature.type .** ， feature 表示特性， type 表示类型
• 模块用 .module.ts
• 路由模块用 .routing.module.ts
• 组件用 .component.ts|html|css
• 服务用 .service.ts
• 管道用 .pipe.ts
• 指令用 .directive.ts
• 类型用 .model.ts
• 数据用 .data.ts
• 文件名、包名采用小写
• 单词之前中横线分隔
• 类名首字母大写
• 方法名、变量名驼峰命名

DEBUG

• Augury： Angular专用的chrome 调试插件
• Sources调试
• WebStorm + JetBrains IDE Support

新建工程

1
2

ng new hello-angular --skip-install
npm install/yarn install

使用cnpm可能产生一些未知问题，慎用
如启动server时遇到rxjs错误，可将版本号固定为6.0.0

新建组件

1
2
3

ng generate component login --inline-template --inline-style
或
ng g c login -it -is

新建服务

1

ng g s todo/todo

引入组件

app.component.html

1
2
3
4

<h1>
  {{title}}
</h1>
<app-login></app-login>

InMemoryWebApiModule

https://segmentfault.com/a/1190000009898540

HttpClient

https://www.jianshu.com/p/350ef028b798

Observable

Angular 6 + Rxjs 6

https://stackoverflow.com/questions/50571550/this-property-fromevent-does-not-exist-on-type-typeof-observable-angular-6

json server

1
2

npm install -g json-server
json-server ./src/app/todo/todo-data.json

mdl

https://medium.com/codingthesmartway-com-blog/angular-material-and-angular-6-material-design-for-angular-6b1a3ee476f0

1
2

npm install --save angular2-mdl
ng add @angular/material

关于模块的最佳实践

Angular团队对于共享特性模块有如下建议

• 坚持在shared目录中创建名叫SharedModule的特性模块（例如在app/shared/shared.module.ts中定义SharedModule）。
• 坚持把可能被应用其它特性模块使用的公共组件、指令和管道放在SharedModule中，这些资产倾向于共享自己的新实例（而不是单例）。
• 坚持在SharedModule中导入所有模块都需要的资产（例如CommonModule和FormsModule）。
• 坚持在SharedModule中声明所有组件、指令和管道。
• 坚持从SharedModule中导出其它特性模块所需的全部符号。
• 避免在SharedModule中指定应用级的单例服务提供商。但如果是故意设计的单例也可以，不过还是要小心。
• 很显然，我们的共享模块还没有全部做到，大家可以作为练习自己试验一下。

同样的对于核心特性模块，官方的建议是

• 坚持把那些“只用一次”的类收集到CoreModule中，并对外隐藏它们的实现细节。简化的AppModule会导入CoreModule，并且把它作为整个应用的总指挥。
• 坚持在core目录下创建一个名叫CoreModule的特性模块（例如在app/core/core.module.ts中定义CoreModule）。
• 坚持把一个要共享给整个应用的单例服务放进CoreModule中（例如ExceptionService和LoggerService）。
• 坚持导入CoreModule中的资产所需要的全部模块（例如CommonModule和FormsModule）。
• 坚持把应用级、只用一次的组件收集到CoreModule中。 只在应用启动时从AppModule中导入它一次，以后再也不要导入它（例如NavComponent和SpinnerComponent等）。
• 坚持从CoreModule中导出AppModule需导入的所有符号，使它们在所有特性模块中可用。
• 坚持防范多次导入CoreModule，并通过添加守卫逻辑来尽快失败。
• 避免在AppModule之外的任何地方导入CoreModule

jsbin

• http://jsbin.com/

TS

• https://ts.xcatliu.com/
• https://github.com/xcatliu/typescript-tutorial/blob/master/README.md

Rxjs

• https://rxjs-cn.github.io/RxJS-Ultimate-CN/

组件自定义样式

1
2
3

@Component({
  styleUrls: ['./regist.component.less']
})

或

1
2
3
4
5
6
7
8
9
10

@Component({
  styles: [
    `
      nz-select {
        margin-right: 8px;
        width: 120px;
      }
    `
  ]
})

brew安装

1
2
3
4
5
6

brew services stop mongodb
brew uninstall mongodb

brew tap mongodb/brew
brew install mongodb-community
brew services start mongodb-community

如遇报错BadValue: Invalid value for version, found 3.6, expected '4.2' or '4.0'.，备份并删除/usr/local/var/mongodb

基本操作

连接

1
2

mongo --host 127.0.0.1
show dbs

创建db

1
2

user school
db.school.insert({name:'为民小学',age:10});

查看删除db

1
2

db.getName()
db.dropDatabase()

查看帮助

1

db.school.help()

查看数据库下的集合

1

show collections

创建集合

1
2
3

db.createCollection('grade3')
db.grade1.insert({name: 'Lily', age: 8})

插入文档

1
2
3

db.grade1.insert({_id: '1',name: 'Han Meimei', age: 8})
db.grade1.save({_id: '1',name: 'Han Meimei', age: 9})
db.grade1.save({_id: '2',name: 'Han Meimei', age: 9})

更新文档

1
2
3
4
5
6
7
8

db.collection.update(
   <query>,
   <updateObj>,
   {
     upsert: <boolean>,
     multi: <boolean>
   }
)

1
2
3
4
5
6
7
8
9

db.grade1.update({name:'Tom'}, {$push: {'hobby':'reading'} })
db.grade1.update({_id:3}, {$addToSet: {friends:'huge'}})
db.grade1.update({_id:3}, {$pop:{friends: 1}})
db.grade1.update({_id:3}, {$addToSet:{friends:{$each: ['huangbo','zhangyixing']}}})
db.grade1.update({_id:3}, {$push:{friends:{$each: ['huangbo','zhangyixing']}}})
db.grade1.update({name: 'Han Meimei', hobby:{$ne:'reading'}, _id: {$ne:'2'}}, {$push: {hobby: 'drinking'}})
db.grade1.update({_id:3}, {$set:{"info11":{id:'11'}}})
db.grade1.update({name: 'Tom'}, {$unset:{'age':''}})

删除文档

1
2
3
4
5
6

db.collection.remove(
   <query>,
   {
     justOne: <boolean>
   }
)

1
2

db.grade1.remove({'name': 'Han Meimei'}, {justOne: true})
db.grade1.remove({'name': 'Han Meimei'})

查询文档

1

db.collection_name.find(query, projection)；

1
2
3
4
5
6

db.grade1.find()
db.grade1.find({age:{$in:[9,11]}})
db.grade1.find({age:{$nin:[9,11]}})
db.grade1.find({age:{$not:{$lt:11}}})
db.grade1.find({age:{$ne:9}})

数组的用法

1
2
3
4
5
6
7

db.grade1.find({"friends" : [ "Lily", "Jobs", "Lucy", "Zhang San" ]})
db.grade1.find({"friends" : [ "Lily" ]})
db.grade1.find({"friends" :{$all: ["Zhang San"]}})
db.grade1.find({"friends" :{$in: ["Zhang San"]}})

db.grade1.find({$where:'this.name == "Tom1"'})
db.grade1.find({$where: function(){return this.age == 9}})

RoboMongo

https://robomongo.org/

mysql&postgre对nosql的支持

https://juejin.im/post/5cefd68551882559685b3c1c
https://learnku.com/laravel/t/13185/in-depth-understanding-of-json-data-type-of-mysql-nosql-in-relational-database
https://www.oschina.net/translate/friendfeed-schemaless-mysql-new

另一种思路，mysql5.7.8+ ， postgre9.3+已经原生对nosql支持，提供json数据类型，天然就解决了动态表单受schema约束的问题
动态表单程序只需要提供mongo/mysql/postgres等多种数据源的可选项即可
对于业务系统来说，spring data对json类型支持比较好，mybatis较差需要写一些代码手工映射

参考文档

https://juejin.im/post/5add9e655188256735642122
https://juejin.im/entry/5926ca5044d9040064076569
https://segmentfault.com/a/1190000012357379
http://mysql.taobao.org/monthly/2019/03/02/
https://cloud.tencent.com/developer/article/1166593
https://www.oschina.net/translate/friendfeed-schemaless-mysql-new
https://docs.mongodb.com/manual/data-modeling/

1. 写一个kextunload/kextload脚本

   1 2 3 4 5 6 7 8 9 10 11

   vi eth.sh #!/bin/zsh # Unload sudo kextunload /Library/Extensions/AppleRTL815XEthernet109.kext sudo kextunload /Library/Extensions/AppleRTL815XComposite109.kext # Load sudo kextload /Library/Extensions/AppleRTL815XEthernet109.kext sudo kextload /Library/Extensions/AppleRTL815XComposite109.kext

2. 使用Automator将脚本封装成APP
   具体操作不细讲了，需要注意的是，因为每次需要输入sudo密码，需要将这个脚本添加到sudoer的例外中去

   1 2	sudo visudo yourname ALL = (root) NOPASSWD: /Users/yourname/sh/eth.sh

3. 在System Preferences -> Users & Group -> Login Item 中，将刚才的APP添加到自启动项

当然不嫌麻烦的话，也可以不用Automator，直接写个launchd的自启动脚本，效果是一样的。

表

分类

• ACT_RE_*: ‘RE’表示repository。 这个前缀的表包含了流程定义和流程静态资源 （图片，规则，等等）。
• ACT_RU_*: ‘RU’表示runtime。 这些运行时的表，包含流程实例，任务，变量，异步任务，等运行中的数据。 Activiti只在流程实例执行过程中保存这些- 数据， 在流程结束时就会删除这些记录。 这样运行时表可以一直很小速度很快。
• ACT_ID_*: ‘ID’表示identity。 这些表包含身份信息，比如用户，组等等。
• ACT_HI_*: ‘HI’表示history。 这些表包含历史数据，比如历史流程实例， 变量，任务等等。
• ACT_GE_*: 通用数据， 用于不同场景下，如存放资源文件。

资源库流程规则表

• act_re_deployment 部署信息表
• act_re_model 流程设计模型部署表
• act_re_procdef 流程定义数据表

运行时数据库表

• act_ru_execution 运行时流程执行实例表
• act_ru_identitylink 运行时流程人员表，主要存储任务节点与参与者的相关信息
• act_ru_task 运行时任务节点表
• act_ru_variable 运行时流程变量数据表
• act_ru_job 工作数据表
• act_ru_event_subscr 事件描述表

历史数据库表

• act_hi_actinst 历史节点表
• act_hi_attachment 历史附件表
• act_hi_comment 历史意见表
• act_hi_identitylink 历史流程人员表
• act_hi_detail 历史详情表，提供历史变量的查询
• act_hi_procinst 历史流程实例表
• act_hi_taskinst 历史任务实例表
• act_hi_varinst 历史变量表

组织机构表

• act_id_group 用户组信息表
• act_id_info 用户扩展信息表
• act_id_membership 用户与用户组对应信息表
• act_id_user 用户信息表

通用数据表

• act_ge_bytearray 二进制数据表
• act_ge_property 属性数据表存储整个流程引擎级别的数据,初始化表结构时，会默认插入三条记录，

参考文档

https://www.jianshu.com/p/7fef2679a26b

GitHub

https://github.com/ageitgey/face_recognition/blob/master/README_Simplified_Chinese.md

dlib安装

https://gist.github.com/ageitgey/629d75c1baac34dfa5ca2a1928a7aeaf

1
2
3
4
5
6
7

git clone https://github.com/davisking/dlib.git

cd dlib
mkdir build; cd build; cmake ..; cmake --build .

cd ..
python3 setup.py install

face_recognition安装

1

pip3 install face_recognition

1
2

export CC=/usr/local/bin/gcc
export CXX=/usr/local/bin/g++

开启慢查询日志

1
2

show variables like '%slow_query_log%';
set global slow_query_log=1;

慢查询时长设置

1
2

show variables like 'long_query_time%';
set global long_query_time=4;

开启后重连

记录到表

1
2
3

show variables like '%log_output%';
set global log_output='TABLE';
select * from mysql.slow_log;

记录未使用索引的查询

1
2

show variables like 'log_queries_not_using_indexes';
set global log_queries_not_using_indexes=1;

测试

1

select sleep(3);

慢查询分析

得到返回记录集最多的10个SQL:

1

mysqldumpslow -s r -t 10 /usr/local/var/mysql/MIPRO-XIII-slow.log

得到访问次数最多的10个SQL:

1

mysqldumpslow -s c -t 10 /usr/local/var/mysql/MIPRO-XIII-slow.log

安装

1

yum install ntp

修改配置

1
2
3
4
5
6
7
8

vim /etc/ntp.conf
server ntp1.aliyun.com
server ntp2.aliyun.com
server ntp3.aliyun.com
server ntp4.aliyun.com
server ntp5.aliyun.com
server ntp6.aliyun.com
server ntp7.aliyun.com

手动同步

1

ntpdate ntp1.aliyun.com

自动同步

1
2

systemctl restart ntpd
ntpq -p

官网

https://brew.sh/

安装

1

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

brew常用命令

1
2
3
4
5
6
7
8

brew install name         # 安装源码
brew info svn                # 显示软件的各种信息（包括版本、源码地址、依赖等等）
brew uninstall name     # 卸载软件
brew search name       # 搜索brew 支持的软件（支持模糊搜索）
brew list                       # 列出本机通过brew安装的所有软件
brew update                # brew自身更新
brew upgrade name    #更新安装过的软件(如果不加软件名，就更新所有可以更新的软件)
brew cleanup             #清除下载的缓存

brew cask的常用命令

1
2
3
4
5
6
7
8

brew cask search               # 列出所有可以被安装的软件
brew cask search name     # 查找所有和 name相关的应用
brew cask install name       # 下载安装软件
brew cask uninstall name   # 卸载软件
brew cask info app             # 列出应用的信息
brew cask list                      # 列出本机安装过的软件列表
brew cask cleanup              # 清除下载的缓存以及各种链接信息
brew cask uninstall name && brew cask install name ＃更新程序 （目前homebrew-cask 并没有命令直接更新已安装的软件，软件更新主要是通过软件自身的完成更新）