TS helpers for imports are not fully handled?

[layershifter]

Environment

• Linaria version: @linaria/babel-preset@4.3.3
• Bundler (+ version): N/A
• Node.js version: Node 16
• OS:

Description

I am implementing custom processor for @griffel/react (microsoft/griffel#309) and was testing changes in our repository.

It seems that I found a problem with @linaria/shaker (?). Looks that the problem is related to handling of __exportStar, but I don't have a simple repro case for it (see "Reproducible Demo").

I tried to make a simple fixture, but it works 💥

 % node testB.js
resultB.code import { __styles as _styles } from "@griffel/react";
const useStyles = /*#__PURE__*/_styles({
  root: {
    sj55zd: "fu2rj6q"
  }
}, {
  d: [".fu2rj6q{color:var(--colorTransparentStroke);}"]
});

The real example from the project, however throws:

 % node testA1.js
/Users/olfedias/WebstormProjects/linaria-re-exports-issue/node_modules/@linaria/babel-preset/lib/module.js:347
        throw new EvalError(`${e.message} in${callstack.join('\n| ')}\n`);
        ^

EvalError: Cannot read properties of undefined (reading 'fontFamilyBase') in
| /Users/olfedias/WebstormProjects/linaria-re-exports-issue/codeA/tokens/typographyStyles.js
| /Users/olfedias/WebstormProjects/linaria-re-exports-issue/codeA/tokens/globals.js
| /Users/olfedias/WebstormProjects/linaria-re-exports-issue/codeA/tokens/index.js
| /Users/olfedias/WebstormProjects/linaria-re-exports-issue/codeA/theme.js
| /Users/olfedias/WebstormProjects/linaria-re-exports-issue/codeA/createArrowStyles.js
| /Users/olfedias/WebstormProjects/linaria-re-exports-issue/codeA/usePopoverSurfaceStyles.js

The suspicious thing in logs is:

linaria:shaker:00006 [start] /Users/olfedias/WebstormProjects/PopoverSurface/tokens/globals.js, onlyExports: typographyStyles
linaria:evaluator:collectExportsAndImports Unknown wrapper of require Node {
  type: 'MemberExpression',
  start: 34,
  end: 54,
  loc: SourceLocation {
    start: Position { line: 2, column: 0, index: 34 },
    end: Position { line: 2, column: 20, index: 54 },
    filename: undefined,
    identifierName: undefined
  },
  object: Node {
    type: 'Identifier',
    start: 34,
    end: 41,
    loc: SourceLocation {
      start: [Position],
      end: [Position],
      filename: undefined,
      identifierName: 'tslib_1'
    },
    name: 'tslib_1',
    leadingComments: undefined,
    innerComments: undefined,
    trailingComments: undefined
  },
  computed: false,
  property: Node {
    type: 'Identifier',
    start: 42,
    end: 54,
    loc: SourceLocation {
      start: [Position],
      end: [Position],
      filename: undefined,
      identifierName: '__exportStar'
    },
    name: '__exportStar',
    leadingComments: undefined,
    innerComments: undefined,
    trailingComments: undefined
  },
  leadingComments: undefined,
  innerComments: undefined,
  trailingComments: undefined
}
linaria:shaker:00006 [import-and-exports] imports: 1 (side-effects: 0), exports: 0, reexports: 0
linaria:shaker:00006 [end] remaining imports: Map(1) { 'tslib' => [ '__exportStar' ] }

I see that there is handling for __exportStar:

linaria/packages/utils/src/collectExportsAndImports.ts

Lines 1010 to 1025 in 860b8d2

	function collectFromCallExpression(
	path: NodePath<CallExpression>,
	state: IState
	) {
	const maybeExportStart = path.get('callee');
	if (!maybeExportStart.isIdentifier()) {
	return;
	}
	const { name } = maybeExportStart.node;
	// TypeScript
	if (name.startsWith('__exportStar')) {
	collectFromExportStarCall(path, state);
	return;
	}

However, it handles CallExpression where callee is an Identifier, however is this case:

const tslib_1 = require('tslib');
tslib_1.__exportStar(require('./typographyStyles'), exports);

We deal with MemberExpression and I don't see handling for it there or in collectFromRequire():

I tried to verify and created another fixture called codeA1 that contains the same code except globals.js, there is used TS results with importHelpers: false i.e.:

var __exportStar =
  (this && this.__exportStar) ||
  function (m, exports) {
    for (var p in m)
      if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p))
        __createBinding(exports, m, p);
  };

__exportStar(require("./typographyStyles"), exports);

And it worked ✅

% node testA1.js 
resultA1.code import { __styles as _styles } from "@griffel/react";
const createArrowStyles = require("./createArrowStyles");
const useStyles = /*#__PURE__*/_styles({
  root: {
    sj55zd: "fu2rj6q"
  }
}, {
  d: [".fu2rj6q{color:var(--colorTransparentStroke);}"]
});

It looks the the scenario with MemberExpression should be handled.

Reproducible Demo

• Clone https://github.com/layershifter/linaria-re-exports-issue
• Run yarn
• node testA.js

[Anber]

Probably fixed in #1194

[layershifter]

@Anber I still see in logs:

2023-02-10T13:43:47.610Z linaria:evaluator:collectExportsAndImports Unknown wrapper of require {
  type: 'MemberExpression',
  start: 34,
  end: 54,
  loc: {
    start: { line: 2, column: 0, index: 34 },
    end: { line: 2, column: 20, index: 54 },
    filename: undefined,
    identifierName: undefined
  },
  object: {
    type: 'Identifier',
    start: 34,
    end: 41,
    loc: {
      start: [Object],
      end: [Object],
      filename: undefined,
      identifierName: 'tslib_1'
    },
    name: 'tslib_1',
    leadingComments: undefined,
    innerComments: undefined,
    trailingComments: undefined
  },
  computed: false,
  property: {
    type: 'Identifier',
    start: 42,
    end: 54,
    loc: {
      start: [Object],
      end: [Object],
      filename: undefined,
      identifierName: '__exportStar'
    },
    name: '__exportStar',
    leadingComments: undefined,
    innerComments: undefined,
    trailingComments: undefined
  },
  leadingComments: undefined,
  innerComments: undefined,
  trailingComments: undefined
}

So, even if it works, this does not seem correct to me.