@lgfe/code-analysis

📖 介绍

前端依赖调用和Browser Api静态代码分析能力（暂不支持jsx分析），可进行评分和生成分析报告

• 多进程分析能力
• 提供api和配置文件两种方式

⚙️ 安装

npm i @lgfe/code-analysis -D

🚀 快速开始

API使用方式(api方式不会生成report文件)

import { analysis } from '@lgfe/code-analysis';
async function scan() {
  try {
    const { report, diagnosisInfos } = await analysis({
      scanSource: [
        {
          // 必须，待扫描源码的配置信息
          name: 'luoge', // 必填，项目名称
          path: ['src'], // 必填，需要扫描的文件路径（基准路径为配置文件所在路径）
          packageFile: 'package.json', // 可选，package.json 文件路径配置，用于收集依赖的版本信息
          format: null, // 可选, 文件路径格式化函数,默认为null,一般不需要配置
          httpRepo: `https://gitlab.xxx.com/xxx/-/blob/${getGitBranch()}/`   // 可选，项目gitlab/github url的访问前缀，用于点击行信息跳转，不填则不跳转
        },
      ],
      analysisTarget: 'react', // 必须，要分析的目标依赖名
      analysisPlugins: [], // 可选，自定义分析插件，默认为空数组，一般不需要配置
      tagList: ['app.localStorage.set'], // 可选，需要标记的API列表，默认为空数组
      tagList: [], // 可选，需要标记的API列表，默认为空数组
      browserApis: ['history', 'document'], // 可选，要分析的BrowserApi，默认为空数组
      reportDir: 'report', // 可选，生成代码分析报告的目录，默认为'report',不支持多级目录配置
      reportTitle: 'luoge依赖调用分析报告', // 可选，分析报告标题，默认为'依赖调用分析报告'
      isScanVue: true, // 可选，是否要扫描分析vue中的ts代码，默认为false
      scorePlugin: 'default', // 可选，评分插件: Function|'default'|null, default表示运行默认插件，默认为null表示不评分
    });
  } catch (e) {
    console.log(e);
  }
}

scan();

cli方式

项目根目录下新建配置文件

// analysis.config.js

/** @type {import('@lgfe/code-analysis').ConfigType} */
module.exports = {
  scanSource: [
    {
      // 必须，待扫描源码的配置信息
      name: 'luoge', // 必填，项目名称
      path: ['src'], // 必填，需要扫描的文件路径（基准路径为配置文件所在路径）
      packageFile: 'package.json', // 可选，package.json 文件路径配置，用于收集依赖的版本信息
      format: null, // 可选, 文件路径格式化函数,默认为null,一般不需要配置
      httpRepo: `https://gitlab.xxx.com/xxx/-/blob/${getGitBranch()}/`   // 可选，项目gitlab/github url的访问前缀，用于点击行信息跳转，不填则不跳转
    },
  ],
  analysisTarget: 'react', // 必须，要分析的目标依赖名
  analysisPlugins: [], // 可选，自定义分析插件，默认为空数组，一般不需要配置
  tagList: ['app.localStorage.set'], // 可选，需要标记的API列表，默认为空数组
  tagList: [], // 可选，需要标记的API列表，默认为空数组
  browserApis: ['history', 'document'], // 可选，要分析的BrowserApi，默认为空数组
  reportDir: 'report', // 可选，生成代码分析报告的目录，默认为'report',不支持多级目录配置
  reportTitle: 'luoge依赖调用分析报告', // 可选，分析报告标题，默认为'依赖调用分析报告'
  isScanVue: false, // 可选，是否要扫描分析vue中的ts代码，默认为false
  scorePlugin: 'default', // 可选，评分插件: Function|'default'|null, default表示运行默认插件，默认为null表示不评分
};

// package.json

"scripts": {
  ...
  analyze: "ca analysis",
  ...
}

命令行输入

npm run analysis -c [自定义配置文件名(不填默认为 analysis.config.js )]

本地record文件夹中会生成对应的index.html分析报告