Skip to content

Commit 4085774

Browse files
authored
fix: console.group in async func (#22)
* chore(deps): add parcel * docs(changelog): update changelog * chore(deps): add serve * chore: igore .cache * feat: add example * fix: fix webpack build umd path * feat: add example for logger * feat: throw the error * feat: default show origin/pathname * fix: webpack build:umd dist path
1 parent ed92aa7 commit 4085774

17 files changed

+2751
-219
lines changed

.gitignore

+3
Original file line numberDiff line numberDiff line change
@@ -38,3 +38,6 @@ node_modules/
3838
# lerna
3939
.changelog
4040

41+
42+
# parcel
43+
.cache/

CHANGELOG.md

+3-15
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,4 @@
1-
# Changelog
1+
# CHANGELOG
22

3-
## v0.0.1-alpha.2 (2019-07-28)
4-
5-
#### :rocket: Enhancement
6-
* `yab-fetch-cache`, `yab-fetch-logger`
7-
* [#2](https://github.com/mjolnirjs/yab/pull/2) feat: add logger middleware ([@leohxj](https://github.com/leohxj))
8-
9-
#### Committers: 1
10-
- Leo Hui ([@leohxj](https://github.com/leohxj))
11-
12-
## v0.0.1-alpha.1 (2019-07-28)
13-
- move repo from [@stonexer](https://github.com/stonexer) to [mjolnirjs](https://github.com/mjolnirjs)
14-
15-
## v0.0.1-alpha.0 (2019-07-28)
16-
- first release
3+
This project adheres to [Semantic Versioning](http://semver.org/).
4+
See all notable changes on [Releases](https://github.com/mjolnirjs/yab/releases) page.

package.json

+12-10
Original file line numberDiff line numberDiff line change
@@ -28,29 +28,31 @@
2828
"@types/node": "^10.14.7",
2929
"@typescript-eslint/eslint-plugin": "^2.0.0",
3030
"@typescript-eslint/parser": "^2.0.0",
31+
"cache-loader": "^4.0.1",
32+
"case-sensitive-paths-webpack-plugin": "^2.2.0",
33+
"cross-env": "^5.2.0",
3134
"eslint": "^5.16.0",
3235
"eslint-config-airbnb-base": "^13.1.0",
3336
"eslint-config-prettier": "^6.0.0",
3437
"eslint-loader": "^2.2.1",
3538
"eslint-plugin-import": "^2.17.3",
3639
"eslint-plugin-prettier": "^3.1.0",
40+
"fork-ts-checker-notifier-webpack-plugin": "^1.0.2",
41+
"fork-ts-checker-webpack-plugin": "^1.4.3",
42+
"friendly-errors-webpack-plugin": "^1.7.0",
3743
"husky": "^3.0.1",
38-
"prettier": "^1.17.1",
44+
"jest": "^24.8.0",
3945
"lerna": "^3.15.0",
4046
"lerna-changelog": "^0.8.2",
41-
"jest": "^24.8.0",
42-
"ts-jest": "^24.0.2",
4347
"lint-staged": "^9.2.0",
48+
"parcel-bundler": "^1.12.3",
49+
"prettier": "^1.17.1",
4450
"rimraf": "^3.0.0",
45-
"typescript": "^3.5.3",
46-
"cache-loader": "^4.0.1",
47-
"case-sensitive-paths-webpack-plugin": "^2.2.0",
48-
"cross-env": "^5.2.0",
49-
"fork-ts-checker-notifier-webpack-plugin": "^1.0.2",
50-
"fork-ts-checker-webpack-plugin": "^1.4.3",
51-
"friendly-errors-webpack-plugin": "^1.7.0",
51+
"serve": "^11.1.0",
5252
"terser-webpack-plugin": "^1.3.0",
53+
"ts-jest": "^24.0.2",
5354
"ts-loader": "^6.0.4",
55+
"typescript": "^3.5.3",
5456
"webpack": "^4.35.3",
5557
"webpack-cli": "^3.3.6",
5658
"webpack-merge": "^4.2.1"

packages/yab-fetch-cache/webpack.config.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ const productionConfig = merge(baseConfig, {
1313
mode: 'production',
1414
output: {
1515
filename: `${projectName}.min.js`,
16-
path: path.join(__dirname, '..', 'dist'),
16+
path: path.join(__dirname, 'dist'),
1717
library: projectName,
1818
libraryTarget: 'umd'
1919
},

packages/yab-fetch-logger/example/index.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<title>Log Middleware</title>
88
</head>
99
<body>
10-
<script src="../../yab-fetch//dist/yab-fetch.min.js"></script>
11-
<script src="../dist/yab-fetch-logger.min.js"></script>
10+
<h1>Please open the devtools to see the console.</h1>
11+
<script src="./index.ts"></script>
1212
</body>
1313
</html>
+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import { createFetch } from '../../yab-fetch/src';
2+
import { createLogger } from '../src';
3+
4+
const yab = createFetch({
5+
onError: (e) => {
6+
console.log(`global error handle: ${e}`);
7+
}
8+
});
9+
yab.use(
10+
createLogger({
11+
collapsed: true
12+
})
13+
);
14+
15+
yab.get('https://jsonplaceholder.typicode.com/todos/1?a=1&b=2');
16+
17+
try {
18+
yab.fetch('https://jsonplaceholder.typicode.com/todos/1', {
19+
method: 'post',
20+
data: {}
21+
});
22+
} catch (e) {
23+
console.log(`can not catch the error: ${e}`);
24+
}
25+
26+
// post api: https://jsonplaceholder.typicode.com/guide.html
27+
yab.post('https://jsonplaceholder.typicode.com/posts', {
28+
data: {
29+
title: 'foo',
30+
body: 'bar',
31+
userId: 1
32+
}
33+
});
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": "../tsconfig.json"
3+
}

packages/yab-fetch-logger/package.json

+10-6
Original file line numberDiff line numberDiff line change
@@ -9,16 +9,20 @@
99
"url": "git+https://github.com/mjolnirjs/yab.git"
1010
},
1111
"scripts": {
12+
"dev": "parcel ./example/index.html --https",
13+
"start": "npm run dev",
14+
"serve": "serve dist/example",
1215
"clean": "rimraf dist",
13-
"build": "npm run clean && npm run build:es && npm run build:lib && npm run build:dist",
16+
"build": "npm run clean && npm run build:es && npm run build:lib && npm run build:umd && npm run build:example",
1417
"build:es": "tsc -p ./tsconfig.es.json",
1518
"build:lib": "tsc -p ./tsconfig.lib.json",
16-
"build:dist": "cross-env NODE_ENV=production webpack --config webpack.config.js",
17-
"lint": "eslint src --ext ts"
19+
"build:umd": "cross-env NODE_ENV=production webpack --config webpack.config.js",
20+
"build:example": "parcel build ./example/index.html -d dist/example --log-level 1",
21+
"lint": "eslint --ext .ts src/"
1822
},
19-
"main": "./dist/lib/index.js",
20-
"module": "./dist/es/index.js",
21-
"types": "./dist/types/index.d.ts",
23+
"main": "dist/lib/index.js",
24+
"module": "dist/es/index.js",
25+
"types": "dist/types/index.d.ts",
2226
"devDependencies": {
2327
"whatwg-fetch": "^3.0.0",
2428
"yab-fetch": "^0.0.1-alpha.4"
+35-15
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
// eslint-disable-next-line import/no-extraneous-dependencies
22
import { IYabFetchContext, YabFetchMiddleware } from 'yab-fetch';
33
import { Options, Logger } from './type';
4-
import { logBeforeFetch, logAfterFetch, logError } from './logHelper';
4+
import { parseUrl } from './utils';
55

66
export const createLogger = (options?: Options): YabFetchMiddleware => {
77
const { collapsed = true } = options || {};
@@ -17,25 +17,45 @@ export const createLogger = (options?: Options): YabFetchMiddleware => {
1717

1818
return async (ctx: IYabFetchContext, next: () => Promise<unknown>) => {
1919
const {
20-
yabRequestInit: { url, method }
20+
yabRequestInit,
21+
yabRequestInit: { url, method, data }
2122
} = ctx;
2223

23-
logger.group(
24-
`📖 yab: %c${method} %c${url} %c@ ${new Date()}`,
25-
'color: #6f42c1;font-size: 14px;',
26-
'color: #005cc5;font-size: 14px;',
27-
'color: #666'
28-
);
29-
30-
logBeforeFetch(logger, ctx);
31-
24+
const startTime = new Date();
3225
try {
3326
await next();
34-
logAfterFetch(logger, ctx);
35-
} catch (e) {
36-
logError(logger, e);
37-
} finally {
27+
const endTime = new Date();
28+
const costTime = endTime.getTime() - startTime.getTime();
29+
30+
const { origin, pathname, search } = parseUrl(url);
31+
32+
logger.group(
33+
`%c${method.toUpperCase()} %c${origin}${pathname} %c@ ${startTime.toLocaleTimeString()}, cost: ${costTime} ms`,
34+
'color: #61bd4f',
35+
'color: #324856',
36+
'color: #50697d'
37+
);
38+
39+
// ------before fetch --------
40+
logger.group('%cbefore fetch', 'color: #416eb6');
41+
logger.log('method:', method);
42+
logger.log('url:', url);
43+
if (method === 'post') logger.log('data:', data);
44+
if (method === 'get') logger.log('data:', search);
45+
logger.log('yabRequestInit:', yabRequestInit);
46+
logger.groupEnd();
47+
48+
// ----- after fetch --------
49+
const { response } = ctx;
50+
logger.group('%cafter fetch', 'color:#715ca8');
51+
logger.log('response:', response);
52+
logger.log('ctx:', ctx);
3853
logger.groupEnd();
54+
} catch (e) {
55+
// logError(logger, e);
56+
throw e;
3957
}
58+
59+
logger.groupEnd();
4060
};
4161
};

packages/yab-fetch-logger/src/logHelper.ts

-28
This file was deleted.
+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
export const parseUrl = (url: string) => {
2+
const defaultProtocol = url.startsWith('//') ? window.location.protocol : '';
3+
4+
return new URL(`${defaultProtocol}${url}`);
5+
};

packages/yab-fetch-logger/tsconfig.es.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -6,5 +6,6 @@
66
"sourceMap": false,
77
"declaration": true,
88
"declarationDir": "dist/types"
9-
}
9+
},
10+
"include": ["src"]
1011
}
-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
11
{
22
"extends": "../../tsconfig.json",
3-
"include": ["src"]
43
}

packages/yab-fetch-logger/tsconfig.lib.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -5,5 +5,6 @@
55
"outDir": "dist/lib",
66
"declaration": false,
77
"sourceMap": false
8-
}
8+
},
9+
"include": ["src"]
910
}

packages/yab-fetch-logger/webpack.config.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ const productionConfig = merge(baseConfig, {
1313
mode: 'production',
1414
output: {
1515
filename: `${projectName}.min.js`,
16-
path: path.join(__dirname, '..', 'dist'),
16+
path: path.join(__dirname, 'dist'),
1717
library: projectName,
1818
libraryTarget: 'umd'
1919
},

packages/yab-fetch/webpack.config.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ const productionConfig = merge(baseConfig, {
1313
mode: 'production',
1414
output: {
1515
filename: `${projectName}.min.js`,
16-
path: path.join(__dirname, '..', 'dist'),
16+
path: path.join(__dirname, 'dist'),
1717
library: projectName,
1818
libraryTarget: 'umd'
1919
},

0 commit comments

Comments
 (0)