bug(router-vite-plugin): `experimental.enableCodeSplitting` nextCreate is not a function about router

[schiller-manuel]

Currently

this

  const value = React.useMemo(function somethingHere() {
    return 'memoed-value';
  }, []);

compiles to

const value = React.useMemo([]);

The issue lies in eliminateUnreferencedIdentifiers.
If this is commented out in compilers.ts, the function is not removed and the error does not occur.

[tannerlinsley]

I released a new version, did that help at all? I was noticing an issue with array destructuring as well.

[schiller-manuel]

I released a new version, did that help at all? I was noticing an issue with array destructuring as well.

no same problem exists in v1.26.8

https://stackblitz.com/edit/github-is6hai-wa51rg?file=package.json

[SeanCassiere]

Did a bit of debugging and figured it out.

If this line, if the getIdentifier function is modified to include this, then this gets resolved.

function getIdentifier(
  path: NodePath<
    | BabelTypes.FunctionDeclaration
    | BabelTypes.FunctionExpression
    | BabelTypes.ArrowFunctionExpression
  >,
): NodePath<BabelTypes.Identifier> | null {
  // ..

  if (
    path.node.type === 'ArrowFunctionExpression' ||
    path.node.type === 'FunctionExpression'
  ) {
    return null
  }

 // ...
}

Alternatively, in the isIdentifierReferenced function, you could add a check before this line to check if a FunctionExpression is a child of a CallExpression.

function isIdentifierReferenced(
  ident: NodePath<BabelTypes.Identifier>,
): boolean {
  const binding = ident.scope.getBinding(ident.node.name)

  if (
    binding?.path.node.type === 'FunctionExpression' &&
    binding.path.parentPath?.node.type === 'CallExpression'
  ) {
    return true
  }
 // ...
}

@tannerlinsley I'm hesitant to add a PR for this since testing pretty much breaks as some snapshot files rely on absolute pathing from your machine for the tests to pass.

This was the test I used to validate that this worked.

// tests/test-files/functionAsParameter.tsx
import * as React from 'react'

const value = React.useMemo(function performAction() {
  return 'true'
}, [])

console.log(value)

const value2 = React.useMemo(() => {
  return 'true'
}, [])

console.log(value2)

Edit: It looks like tests aren't failing in CI since the script in the package.json is named differently.