@babel/core#PluginPass TypeScript Examples

The following examples show how to use @babel/core#PluginPass. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: babel.ts    From xwind with MIT License 6 votes vote down vote up 
function babel(
  babel: typeof Babel,
  config: { config?: string },
  workingPath: string
): PluginObj<PluginPass> {
  const { types: t } = babel;
  const twConfigPath = getTwConfigPath(config.config);
  return {
    name: "xwind",
    visitor: {
      ImportDefaultSpecifier(path, state) {
        //get referencePaths for default import from "xwind" or "xwind/macro"
        if (!path.parentPath.isImportDeclaration()) return;
        if (path.parent.type !== "ImportDeclaration") return;
        if (!MODULES.includes(path.parent.source.value)) return;

        const referencePaths =
          path.scope.bindings[path.node.local.name].referencePaths;

        //remove default import and remove import if no other specifiers exist
        path.remove();
        if (path.parent.specifiers.length === 0) {
          path.parentPath.remove();
        }

        if (!referencePaths.length) return;

        const transformer = getCachedTransformer(twConfigPath);
        transformer(referencePaths, state, t);
      },
    },
  };
}
Example #2
Source File: visitor.ts    From react-dev-inspector with MIT License 6 votes vote down vote up 
createVisitor = ({ cwd, excludes }: {
  cwd?: string,
  excludes?: (string | RegExp)[],
}): Visitor<PluginPass> => {
  const isExclude = excludes?.length
    ? memo((filePath: string): boolean => pathMatch(filePath, excludes))
    : () => false

  const pathRelative = memo((filePath: string): string => relative(
    cwd ?? process.cwd(),
    filePath,
  ))

  const visitor: Visitor<PluginPass> = {
    JSXOpeningElement: {
      enter(path, state: PluginPass) {
        const filePath = state?.file?.opts?.filename
        if (!filePath) return
        if (isExclude(filePath)) return

        const relativePath = pathRelative(filePath)

        doJSXOpeningElement(
          path.node,
          {
            relativePath,
          },
        )
      },
    },
  }

  return visitor
}
Example #3
Source File: index.ts    From design-systems-cli with MIT License 5 votes vote down vote up 
/**
 * Find imports of @design-system/cli components and optionally replaces their style imports.
 */
export default function replaceStyles(
  { types }: Babel,
  { scope, use, replace = 'main' }: ReplaceStylesOptions
): babel.PluginObj {
  /**  Replace an import inside a component */
  function replaceCssImports(
    path: NodePath<BabelTypes.ImportDeclaration>,
    state: PluginPass,
    importName: string
  ) {
    const isScope =
      state?.file?.opts?.filename &&
      state.file.opts.filename.includes(`@${scope}/`);

    if (isScope && importName.includes(`${replace}.css`)) {
      // We found a candidate for replacement
      const dirname = nodePath.dirname(state.file.opts.filename as string);
      const next = nodePath.join(dirname, importName.replace(replace, use));

      if (exists(next)) {
        // Replacement exists
        const importDeclaration = types.importDeclaration(
          [],
          types.stringLiteral(`../${use}.css`)
        );
        path.replaceInline(importDeclaration);
      }
    }
  }

  /**  Replace an css.js import inside a component */
  function replaceCssJsImports(
    path: NodePath<BabelTypes.ImportDeclaration>,
    state: PluginPass,
    importName: string
  ) {
    const isScope =
      state?.file?.opts?.filename &&
      state.file.opts.filename.includes(`@${scope}/`);

    if (
      isScope &&
      path.node.specifiers.length &&
      importName.includes('.css') &&
      !importName.includes(use)
    ) {
      const dirname = nodePath.dirname(state.file.opts.filename as string);
      const newImport = importName.replace('.css', `-${use}.css`);
      const newImportPath = nodePath.join(dirname, newImport);

      if (exists(newImportPath)) {
        const importDeclaration = types.importDeclaration(
          path.node.specifiers,
          types.stringLiteral(newImport)
        );
        path.replaceWith(importDeclaration);
      }
    }
  }

  return {
    visitor: {
      ImportDeclaration(path, state) {
        const importName = path.node.source.value;
        replaceCssImports(path, state, importName);
        replaceCssJsImports(path, state, importName);
      },
    },
  };
}