blackteay/fes.js
1
0
Fork 0
mirror of https://github.com/WeBankFinTech/fes.js.git synced 2025-04-05 19:41:57 +08:00
Code Issues Projects Releases Wiki Activity

feat: 优化 webpack 信息输出

Browse Source
This commit is contained in:
winixt 2022-05-14 18:16:12 +08:00
parent 7da7a348e2
commit 2f1c551522
15 changed files with 78 additions and 130 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/fes-builder-webpack/package.json
View File

@ -33,7 +33,6 @@
"@babel/plugin-transform-runtime": "^7.16.4",
"@babel/preset-env": "^7.16.4",
"@babel/preset-typescript": "^7.15.0",
"@fesjs/compiler": "^2.0.5",
"@fesjs/utils": "^2.0.4",
"@vue/babel-plugin-jsx": "^1.1.1",
"autoprefixer": "^10.2.4",
@ -59,7 +58,8 @@
"webpack": "^5.69.0",
"webpack-bundle-analyzer": "^4.4.0",
"webpack-chain": "^6.5.1",
"webpack-dev-server": "^4.8.1"
"webpack-dev-server": "^4.8.1",
"webpackbar": "^5.0.2"
},
"peerDependencies": {
"@vue/compiler-sfc": "^3.0.5",

7
packages/fes-builder-webpack/src/plugins/commands/build/index.js
View File

@ -5,14 +5,11 @@
import { relative } from 'path';
import { existsSync } from 'fs';
import { Logger } from '@fesjs/compiler';
const logger = new Logger('fes:builder-webpack');
export default function (api) {
const {
paths,
utils: { rimraf },
utils: { rimraf, logger },
} = api;
api.registerCommand({
@ -38,7 +35,7 @@ export default function (api) {
// clear output path before exec build
if (process.env.CLEAR_OUTPUT !== 'none') {
if (paths.absOutputPath && existsSync(paths.absOutputPath)) {
logger.debug(`Clear OutputPath: ${paths.absNodeModulesPath}`);
logger.info(`Clear OutputPath: ${paths.absOutputPath}`);
rimraf.sync(paths.absOutputPath);
}
}

5
packages/fes-builder-webpack/src/plugins/commands/dev/devServer.js
View File

@ -1,5 +1,6 @@
import WebpackDevServer from 'webpack-dev-server';
import webpack from 'webpack';
import { chalk } from '@fesjs/utils';
export function startDevServer({ webpackConfig, host, port, proxy, https, beforeMiddlewares, afterMiddlewares, customerDevServerConfig }) {
const options = {
@ -13,9 +14,6 @@ export function startDevServer({ webpackConfig, host, port, proxy, https, before
port,
},
},
devMiddleware: {
stats: 'errors-only',
},
setupMiddlewares(middlewares) {
middlewares.unshift(...beforeMiddlewares);
middlewares.push(...afterMiddlewares);
@ -33,6 +31,7 @@ export function startDevServer({ webpackConfig, host, port, proxy, https, before
const compiler = webpack(webpackConfig);
const server = new WebpackDevServer(options, compiler);
console.log(chalk.green('Server: '), chalk.blue(`${options.server}://${options.host}:${options.port}`));
server.startCallback((err) => {
if (err) {
console.error(err);

6
packages/fes-builder-webpack/src/plugins/commands/dev/index.js
View File

@ -1,11 +1,7 @@
import { Logger } from '@fesjs/compiler';
const logger = new Logger('fes:builder-webpack');
export default (api) => {
const {
paths,
utils: { chalk, getPort, getHostName, changePort },
utils: { chalk, getPort, getHostName, changePort, logger },
} = api;
let port;

5
packages/fes-builder-webpack/src/plugins/commands/webpackConfig/index.js
View File

@ -56,7 +56,7 @@ export default async function getConfig({ api, cwd, config, env, entry = {}, mod
const absoluteOutput = join(cwd, config.outputPath || 'dist');
webpackConfig.mode(env);
webpackConfig.stats('verbose');
webpackConfig.stats('errors-only');
webpackConfig.externals(config.externals || {});
webpackConfig.devtool(isDev ? config.devtool || 'cheap-module-source-map' : config.devtool);
@ -226,6 +226,8 @@ export default async function getConfig({ api, cwd, config, env, entry = {}, mod
]);
}
webpackConfig.plugin('progress').use(require.resolve(require.resolve('webpackbar')));
// --------------- define -----------
createDefineWebpackConfig({
config,
@ -279,6 +281,7 @@ export default async function getConfig({ api, cwd, config, env, entry = {}, mod
const memo = webpackConfig.toConfig();
memo.infrastructureLogging = {
level: 'error',
...memo.infrastructureLogging,
};
memo.output = {

11
packages/fes-compiler/src/index.js
View File

@ -3,19 +3,10 @@
* https://github.com/umijs/umi/tree/master/packages/core
*/
import Config from './config';
import Logger from './logger';
import Service from './service';
import PluginAPI from './service/pluginAPI';
import { PluginType } from './service/enums';
import { isPluginOrPreset } from './service/utils/pluginUtils';
export {
Config,
Service,
PluginAPI,
isPluginOrPreset,
PluginType,
Logger
};
export { Config, Service, PluginAPI, isPluginOrPreset, PluginType };

86
packages/fes-compiler/src/logger/index.js
View File

@ -1,86 +0,0 @@
/**
* @copy 该文件代码大部分出自 umi，有需要请参考：
* https://github.com/umijs/umi/tree/master/packages/core
*/
import { createDebug, chalk } from '@fesjs/utils';
import readline from 'readline';
export default class Logger {
LOG = chalk.black.bgBlue('LOG');
INFO = chalk.black.bgBlue('INFO');
WARN = chalk.black.bgHex('#faad14')('WARN');
ERROR = chalk.black.bgRed('ERROR');
PROFILE = chalk.black.bgCyan('PROFILE');
constructor(namespace) {
// TODO: get namespace filename accounding caller function
if (!namespace) {
throw new Error('logger needs namespace');
}
this.namespace = namespace;
this.profilers = {};
this.debug = createDebug(this.namespace);
}
log(...args) {
// TODO: node env production
console.log(this.LOG, ...args);
}
/**
* The {@link logger.info} function is an alias for {@link logger.log()}.
* @param args
*/
info(...args) {
console.log(this.INFO, ...args);
}
error(...args) {
console.error(this.ERROR, ...args);
}
warn(...args) {
console.warn(this.WARN, ...args);
}
formatTiming(timing) {
return timing < 60 * 1000 ? `${Math.round(timing / 10) / 100}s` : `${Math.round(timing / 600) / 100}m`;
}
profile(id, message) {
const time = Date.now();
const namespace = `${this.namespace}:${id}`;
// for test
let msg;
if (this.profilers[id]) {
const timeEnd = this.profilers[id];
delete this.profilers[id];
process.stderr.write(`${this.PROFILE} `);
msg = `${this.PROFILE} ${chalk.cyan(`└ ${namespace}`)} Completed in ${this.formatTiming(time - timeEnd)}`;
console.log(msg);
} else {
msg = `${this.PROFILE} ${chalk.cyan(`┌ ${namespace}`)} ${message || ''}`;
console.log(msg);
}
this.profilers[id] = time;
return msg;
}
clearConsole(title) {
if (process.stdout.isTTY) {
const blank = '\n'.repeat(process.stdout.rows);
console.log(blank);
readline.cursorTo(process.stdout, 0, 0);
readline.clearScreenDown(process.stdout);
if (title) {
console.log(title);
}
}
}
}

1
packages/fes-compiler/src/service/index.js
View File

@ -21,7 +21,6 @@ import getPaths from './getPaths';
// TODO
// 1. duplicated key
// 2. Logger
export default class Service extends EventEmitter {
cwd;

3
packages/fes-compiler/src/service/pluginAPI.js
View File

@ -7,7 +7,6 @@ import assert from 'assert';
import * as utils from '@fesjs/utils';
import { isValidPlugin, pathToObj } from './utils/pluginUtils';
import { EnableBy, PluginType, ServiceStage } from './enums';
import Logger from '../logger';
// TODO
// 标准化 logger
@ -17,7 +16,7 @@ export default class PluginAPI {
this.key = opts.key;
this.service = opts.service;
this.utils = utils;
this.logger = new Logger(`fes:plugin:${this.id || this.key}`);
this.logger = utils.logger;
}
// TODO: reversed keys

1
packages/fes-plugin-jest/package.json
View File

@ -31,7 +31,6 @@
},
"dependencies": {
"@babel/preset-env": "^7.15.0",
"@fesjs/compiler": "^2.0.5",
"@vue/babel-plugin-jsx": "^1.0.6",
"babel-jest": "^27.0.6",
"jest": "^27.0.6",

17
packages/fes-plugin-jest/src/index.js
View File

@ -1,13 +1,10 @@
import assert from 'assert';
import { join } from 'path';
import { existsSync } from 'fs';
import { Logger } from '@fesjs/compiler';
// jest-cli 不在暴露 options，维护一份本地的 options
import { options as CliOptions } from './jestArgs';
import createDefaultConfig from './createDefaultConfig';
const logger = new Logger('fes:plugin-unit-jest');
function getCommandOptiton() {
const opts = [];
Object.keys(CliOptions).forEach((key) => {
@ -28,7 +25,7 @@ function getCommandOptiton() {
export default function (api) {
const {
utils: { mergeConfig },
utils: { mergeConfig, logger },
cwd,
} = api;
@ -43,22 +40,22 @@ export default function (api) {
args._.shift();
}
args.debug && logger.log(`args: ${JSON.stringify(args)}`);
args.debug && logger.info(`args: ${JSON.stringify(args)}`);
// Read config from cwd/jest.config.js
const userJestConfigFile = join(cwd, 'jest.config.js');
const userJestConfig = existsSync(userJestConfigFile) && require(userJestConfigFile);
args.debug && logger.log(`config from jest.config.js: ${JSON.stringify(userJestConfig)}`);
args.debug && logger.info(`config from jest.config.js: ${JSON.stringify(userJestConfig)}`);
// Read jest config from package.json
const packageJSONPath = join(cwd, 'package.json');
const packageJestConfig = existsSync(packageJSONPath) && require(packageJSONPath).jest;
args.debug && logger.log(`jest config from package.json: ${JSON.stringify(packageJestConfig)}`);
args.debug && logger.info(`jest config from package.json: ${JSON.stringify(packageJestConfig)}`);
// Merge configs
// user config and args config could have value function for modification
const config = mergeConfig(createDefaultConfig(cwd, args), packageJestConfig, userJestConfig);
args.debug && logger.log(`final config: ${JSON.stringify(config)}`);
args.debug && logger.info(`final config: ${JSON.stringify(config)}`);
// Generate jest options
const argsConfig = Object.keys(CliOptions).reduce((prev, name) => {
@ -69,7 +66,7 @@ export default function (api) {
if (alias && args[alias]) prev[name] = args[alias];
return prev;
}, {});
args.debug && logger.log(`config from args: ${JSON.stringify(argsConfig)}`);
args.debug && logger.info(`config from args: ${JSON.stringify(argsConfig)}`);
// 比较大的库建议使用require，使用时才加载，提升fes命令的效率
const { runCLI } = require('jest');
@ -87,7 +84,7 @@ export default function (api) {
},
[cwd],
);
args.debug && logger.log(result);
args.debug && logger.info(result);
// Throw error when run failed
assert(result.results.success, 'Test with jest failed');

5
packages/fes-preset-built-in/src/plugins/route/index.js
View File

@ -1,12 +1,9 @@
import { readdirSync, statSync, readFileSync } from 'fs';
import { join, extname, posix, basename } from 'path';
import { lodash, parser, generator } from '@fesjs/utils';
import { lodash, parser, generator, logger } from '@fesjs/utils';
import { parse } from '@vue/compiler-sfc';
import { Logger } from '@fesjs/compiler';
import { runtimePath } from '../../utils/constants';
const logger = new Logger('fes:router');
// pages
// ├── index.vue # 根路由页面 路径 /
// ├── *.vue # 模糊匹配 路径 *

2
packages/fes-utils/src/index.js
View File

@ -31,6 +31,7 @@ import getHostName from './getHostName';
import resolveRuntimeEnv from './resolveRuntimeEnv';
import stringifyObjValue from './stringifyObjValue';
import getTargetsAndBrowsersList from './getTargetsAndBrowsersList';
import * as logger from './logger';
export {
chalk,
@ -50,6 +51,7 @@ export {
portfinder,
resolve,
generator,
logger,
};
export {

35
packages/fes-utils/src/logger.js Normal file
View File

@ -0,0 +1,35 @@
import chalk from 'chalk';
export const prefixes = {
wait: `${chalk.cyan('wait')} -`,
error: `${chalk.red('error')} -`,
warn: `${chalk.yellow('warn')} -`,
ready: `${chalk.green('ready')} -`,
info: `${chalk.cyan('info')} -`,
event: `${chalk.magenta('event')} -`,
debug: `${chalk.gray('debug')} -`,
};
export function wait(...message) {
console.log(prefixes.wait, ...message);
}
export function error(...message) {
console.error(prefixes.error, ...message);
}
export function warn(...message) {
console.warn(prefixes.warn, ...message);
}
export function ready(...message) {
console.log(prefixes.ready, ...message);
}
export function info(...message) {
console.log(prefixes.info, ...message);
}
export function event(...message) {
console.log(prefixes.event, ...message);
}

20
yarn.lock
View File

@ -8788,6 +8788,11 @@ pretty-format@^27.5.1:
ansi-styles "^5.0.0"
react-is "^17.0.1"
pretty-time@^1.1.0:
version "1.1.0"
resolved "https://registry.npmmirror.com/pretty-time/-/pretty-time-1.1.0.tgz#ffb7429afabb8535c346a34e41873adf3d74dd0e"
integrity sha512-28iF6xPQrP8Oa6uxE6a1biz+lWeTOAPKggvjB8HAs6nVMKZwf5bG++632Dx614hIWgUPkgivRfG+a8uAXGTIbA==
prismjs@^1.27.0:
version "1.27.0"
resolved "https://registry.npmmirror.com/prismjs/-/prismjs-1.27.0.tgz#bb6ee3138a0b438a3653dd4d6ce0cc6510a45057"
@ -9756,6 +9761,11 @@ stack-utils@^2.0.3:
resolved "https://registry.npmmirror.com/statuses/-/statuses-1.5.0.tgz#161c7dac177659fd9811f43771fa99381478628c"
integrity sha512-OpZ3zP+jT1PI7I8nemJX4AKmAX070ZkYPVWV/AaKTJl+tXCTGyVdC1a4SL8RUQYEwk/f34ZX8UTykN68FwrqAA==
std-env@^3.0.1:
version "3.1.1"
resolved "https://registry.npmmirror.com/std-env/-/std-env-3.1.1.tgz#1f19c4d3f6278c52efd08a94574a2a8d32b7d092"
integrity sha512-/c645XdExBypL01TpFKiG/3RAa/Qmu+zRi0MwAmrdEkwHNuN0ebo8ccAXBBDa5Z0QOJgBskUIbuCK91x0sCVEw==
stickybits@^3.7.9:
version "3.7.9"
resolved "https://registry.npmmirror.com/stickybits/-/stickybits-3.7.9.tgz#0e469ffb960e1e661bd308ba4da370dc439902bf"
@ -10826,6 +10836,16 @@ webpack@^5.69.0:
watchpack "^2.3.1"
webpack-sources "^3.2.3"
webpackbar@^5.0.2:
version "5.0.2"
resolved "https://registry.npmmirror.com/webpackbar/-/webpackbar-5.0.2.tgz#d3dd466211c73852741dfc842b7556dcbc2b0570"
integrity sha512-BmFJo7veBDgQzfWXl/wwYXr/VFus0614qZ8i9znqcl9fnEdiVkdbi0TedLQ6xAK92HZHDJ0QmyQ0fmuZPAgCYQ==
dependencies:
chalk "^4.1.0"
consola "^2.15.3"
pretty-time "^1.1.0"
std-env "^3.0.1"
websocket-driver@>=0.5.1, websocket-driver@^0.7.4:
version "0.7.4"
resolved "https://registry.npmmirror.com/websocket-driver/-/websocket-driver-0.7.4.tgz#89ad5295bbf64b480abcba31e4953aca706f5760"