1.4.0 • Published 3 years ago

babel-plugin-code-inject v1.4.0

Weekly downloads
-
License
ISC
Repository
github
Last release
3 years ago

babel-plugin-code-inject

这是一个 babel 插件,根据注释自动插入相应的函数调用, 并通过注释控制所插入的具体位置,同时会根据配置自动引入相关的依赖包。此外还支持代码片段的插入。

Install

npm i babel-plugin-code-inject -D

Usage

configuration

示例:

module.exports = {
  plugins: [
    ['code-inject', {
      log: {
        // named | default | namespaced
        kind: 'named',
        require: 'log4js'
      },
      codeTemplate: "alert('test')"
    }]
  ]
}

methods

@inject:xxx

以注释形式声明在函数上方, xxx取自插件参数配置的 key, 表示改函数需要插入 xxx, 默认是函数调用, 如果配置提供的是字符串则认为是代码片段

@code:xxx

以注释形式声明在函数内部,需和@inject:xxx 配套使用, 就像 async await,表示 xxx 插入位置为此处, 若未手动声明则为默认插入至函数内部第一行。

// @inject:log
function foo() {
  const c = 1
  //@code:log
  return 1
}

example

处理前的代码

// @inject:noRequire
const fn = () => true

// @inject:log
function foo() {
  const c = 1
  //@code:log
  return 1
}

// @inject:codeTemplate
function foo2() {
  const c = 2
  //@code:codeTemplate
  return 1
}

处理后的代码

import { log } from 'log4js'

const fn = () => {
  log()
  return true
}

function foo() {
  const c = 1
  log()
  return 1
}

function foo() {
  const c = 2
  alert('test')
  return 1
}

options

key

用于识 @inject:xxx 声明, 以及非 代码片段 情况下的函数名

String

当值的类型为 string 时, 如下方的 anyKey, 表示使用的是代码段模式

module.exports = {
  plugins: [
    ['code-inject', {
      anyKey: "console.log('code segment')"
    }]
  ]
}

Object

当值的类型是对象, 则表示是函数调用

kind

kind 表示导入形式。 有三种导入方式 named 、 default、 namespaced, 此设计参考 babel-helper-module-imports

  • named 对应 import { a } from "b" 形式
  • default 对应 import a from "b" 形式
  • namespaced 对应 import * as a from "b" 形式

require

可选

require 为依赖的包名, 若不填写则表示全局方法, 则不会再进行 import