Giter Club home page Giter Club logo

Comments (11)

rikonor avatar rikonor commented on August 26, 2024 8

Confirming this is still an issue.

That said, it can be circumvented by invoking codegen directly instead of using a tagged template:

# Instead of
codegen`module.exports = ...`

# do
codegen(`module.exports = ...`)

from babel-plugin-codegen.

kentcdodds avatar kentcdodds commented on August 26, 2024

Hi @foxbunny,

Interesting. Do you get this same error when your string is used to generate actual code?

If you could make a reproduction repository that would be very helpful.

from babel-plugin-codegen.

foxbunny avatar foxbunny commented on August 26, 2024

@kentcdodds Yes. I get that with pretty much anything, string or no string.

I'll see if I can whip up a repro during the week.

from babel-plugin-codegen.

foxbunny avatar foxbunny commented on August 26, 2024

@kentcdodds Here's the repo that contains the sample. Details are in the readme.

from babel-plugin-codegen.

kentcdodds avatar kentcdodds commented on August 26, 2024

I can reproduce this. Thank you. Weird things are going on here. I'm wondering if it could be a regression bug in recent versions of babel.

I don't have time to look in it today, but I'll try this week sometime.

from babel-plugin-codegen.

foxbunny avatar foxbunny commented on August 26, 2024

OK. Thanks for looking into this. I'm really excited about trying codegen. :)

from babel-plugin-codegen.

kentcdodds avatar kentcdodds commented on August 26, 2024

I'm afraid that I don't personally have time to allocate to digging into this. Sorry :-/

from babel-plugin-codegen.

foxbunny avatar foxbunny commented on August 26, 2024

No biggie. I'd look into it myself, but kinda similar situation time-wise. :)

from babel-plugin-codegen.

Fi2zz avatar Fi2zz commented on August 26, 2024

this issue can be reproduced when use with "@babel/preset-env":

see error stacks below

Error: ~/babel-demo/src/index.js: codegen: Must module.exports a string.
    at getReplacement (~/babel-demo/codegen/helpers.js:46:11)
    at replace (~/babel-demo/codegen/helpers.js:67:23)
    at asFunction (~/babel-demo/codegen/replace.js:144:5)
    at asIdentifier (~/babel-demo/codegen/replace.js:67:18)
    at PluginPass.Identifier (~/babel-demo/codegen/index.js:26:11)
    at newFn (~/babel-demo/node_modules/@babel/traverse/lib/visitors.js:179:21)
    at NodePath._call (~/babel-demo/node_modules/@babel/traverse/lib/path/context.js:55:20)
    at NodePath.call (~/babel-demo/node_modules/@babel/traverse/lib/path/context.js:42:17)
    at NodePath.visit (~/babel-demo/node_modules/@babel/traverse/lib/path/context.js:90:31)
    at TraversalContext.visitQueue (~/babel-demo/node_modules/@babel/traverse/lib/context.js:112:16) {
  code: 'BABEL_TRANSFORM_ERROR'
}

this line get the value with undefined:

const code = argumentsPaths[0].evaluate().value;

 function asFunction(path, fileOpts) {
    const argumentsPaths = path.get("arguments");
    // variable code  is undefined, 
    const code = argumentsPaths[0].evaluate().value;
    replace(
      {
        path: argumentsPaths[0].parentPath,
        code,
        fileOpts
      },
      babel
    );
  }
function getReplacement({ code, fileOpts, args = [] }, babel) {
  let module = requireFromString(code, fileOpts.filename);
  // If a function is epxorted, call it with args
  if (typeof module === "function") {
    module = module(...args);
  } else if (args.length) {
    throw new Error(
      `codegen module (${p.relative(
        process.cwd(),
        fileOpts.filename
      )}) cannot accept arguments because it does not export a function. You passed the arguments: ${args.join(
        ", "
      )}`
    );
  }

  // Convert whatever we got now (hopefully a string) into AST form
  if (typeof module !== "string") {
    // console.log(typeof module);
    throw new Error("codegen: Must module.exports a string.");


  }
  return babel.template(module, {
    preserveComments: true,
    placeholderPattern: false,
    ...fileOpts.parserOpts,
    sourceType: "module"
  })();
}

from babel-plugin-codegen.

Fi2zz avatar Fi2zz commented on August 26, 2024

this issue can be reproduced when use with "@babel/preset-env":

see error stacks below

Error: ~/babel-demo/src/index.js: codegen: Must module.exports a string.
    at getReplacement (~/babel-demo/codegen/helpers.js:46:11)
    at replace (~/babel-demo/codegen/helpers.js:67:23)
    at asFunction (~/babel-demo/codegen/replace.js:144:5)
    at asIdentifier (~/babel-demo/codegen/replace.js:67:18)
    at PluginPass.Identifier (~/babel-demo/codegen/index.js:26:11)
    at newFn (~/babel-demo/node_modules/@babel/traverse/lib/visitors.js:179:21)
    at NodePath._call (~/babel-demo/node_modules/@babel/traverse/lib/path/context.js:55:20)
    at NodePath.call (~/babel-demo/node_modules/@babel/traverse/lib/path/context.js:42:17)
    at NodePath.visit (~/babel-demo/node_modules/@babel/traverse/lib/path/context.js:90:31)
    at TraversalContext.visitQueue (~/babel-demo/node_modules/@babel/traverse/lib/context.js:112:16) {
  code: 'BABEL_TRANSFORM_ERROR'
}

this line get the value with undefined:

const code = argumentsPaths[0].evaluate().value;

 function asFunction(path, fileOpts) {
    const argumentsPaths = path.get("arguments");
    // variable code  is undefined, 
    const code = argumentsPaths[0].evaluate().value;
    replace(
      {
        path: argumentsPaths[0].parentPath,
        code,
        fileOpts
      },
      babel
    );
  }
function getReplacement({ code, fileOpts, args = [] }, babel) {
  let module = requireFromString(code, fileOpts.filename);
  // If a function is epxorted, call it with args
  if (typeof module === "function") {
    module = module(...args);
  } else if (args.length) {
    throw new Error(
      `codegen module (${p.relative(
        process.cwd(),
        fileOpts.filename
      )}) cannot accept arguments because it does not export a function. You passed the arguments: ${args.join(
        ", "
      )}`
    );
  }

  // Convert whatever we got now (hopefully a string) into AST form
  if (typeof module !== "string") {
    // console.log(typeof module);
    throw new Error("codegen: Must module.exports a string.");


  }
  return babel.template(module, {
    preserveComments: true,
    placeholderPattern: false,
    ...fileOpts.parserOpts,
    sourceType: "module"
  })();
}

seems @babel/plugin-transform-template-literals caused this issue, i have tested them one by one and combinations;

node_modules/@babel/preset-env/lib/index.js

const pluginOfPresetEnv =[];
for(let key of transformations .keys()){
  pluginOfPresetEnv.push(key)
}
console.log('pluginOfPresetEnv',pluginOfPresetEnv)
  //pluginOfPresetEnv [
    //   'transform-template-literals',
    //   'transform-literals',
    //   'transform-function-name',
    //   'transform-arrow-functions',
    //   'transform-block-scoped-functions',
    //   'transform-classes',
    //   'transform-object-super',
    //   'transform-shorthand-properties',
    //   'transform-duplicate-keys',
    //   'transform-computed-properties',
    //   'transform-for-of',
    //   'transform-sticky-regex',
    //   'transform-dotall-regex',
    //   'transform-unicode-regex',
    //   'transform-spread',
    //   'transform-parameters',
    //   'transform-destructuring',
    //   'transform-block-scoping',
    //   'transform-typeof-symbol',
    //   'transform-new-target',
    //   'transform-regenerator',
    //   'transform-exponentiation-operator',
    //   'transform-async-to-generator',
    //   'proposal-async-generator-functions',
    //   'proposal-object-rest-spread',
    //   'proposal-unicode-property-regex',
    //   'proposal-json-strings',
    //   'proposal-optional-catch-binding'
  // ]


  let pluginOfPresetEnvArray =[

        // 'transform-template-literals',
      'transform-literals',
      'transform-function-name',
      'transform-arrow-functions',
      'transform-block-scoped-functions',
      'transform-classes',
      'transform-object-super',
      'transform-shorthand-properties',
      'transform-duplicate-keys',
      'transform-computed-properties',
      'transform-for-of',
      'transform-sticky-regex',
      'transform-dotall-regex',
      'transform-unicode-regex',
      'transform-spread',
      'transform-parameters',
      'transform-destructuring',
      'transform-block-scoping',
      'transform-typeof-symbol',
      'transform-new-target',
      'transform-regenerator',
      'transform-exponentiation-operator',
      'transform-async-to-generator',
      'proposal-async-generator-functions',
      'proposal-object-rest-spread',
      'proposal-unicode-property-regex',
      'proposal-json-strings',
      'proposal-optional-catch-binding'

  ]

transformations.forEach(pluginName => {
  if(pluginOfPresetEnvArray.includes(pluginName)){
  const config  ={ spec,loose, useBuiltIns: pluginUseBuiltIns}
  plugins.push([getPlugin(pluginName), config])
  }
});
const regenerator = transformations.has("transform-regenerator");

from babel-plugin-codegen.

Fi2zz avatar Fi2zz commented on August 26, 2024

this issue can be reproduced when use with "@babel/preset-env":
see error stacks below

Error: ~/babel-demo/src/index.js: codegen: Must module.exports a string.
    at getReplacement (~/babel-demo/codegen/helpers.js:46:11)
    at replace (~/babel-demo/codegen/helpers.js:67:23)
    at asFunction (~/babel-demo/codegen/replace.js:144:5)
    at asIdentifier (~/babel-demo/codegen/replace.js:67:18)
    at PluginPass.Identifier (~/babel-demo/codegen/index.js:26:11)
    at newFn (~/babel-demo/node_modules/@babel/traverse/lib/visitors.js:179:21)
    at NodePath._call (~/babel-demo/node_modules/@babel/traverse/lib/path/context.js:55:20)
    at NodePath.call (~/babel-demo/node_modules/@babel/traverse/lib/path/context.js:42:17)
    at NodePath.visit (~/babel-demo/node_modules/@babel/traverse/lib/path/context.js:90:31)
    at TraversalContext.visitQueue (~/babel-demo/node_modules/@babel/traverse/lib/context.js:112:16) {
  code: 'BABEL_TRANSFORM_ERROR'
}

this line get the value with undefined:

const code = argumentsPaths[0].evaluate().value;

 function asFunction(path, fileOpts) {
    const argumentsPaths = path.get("arguments");
    // variable code  is undefined, 
    const code = argumentsPaths[0].evaluate().value;
    replace(
      {
        path: argumentsPaths[0].parentPath,
        code,
        fileOpts
      },
      babel
    );
  }
function getReplacement({ code, fileOpts, args = [] }, babel) {
  let module = requireFromString(code, fileOpts.filename);
  // If a function is epxorted, call it with args
  if (typeof module === "function") {
    module = module(...args);
  } else if (args.length) {
    throw new Error(
      `codegen module (${p.relative(
        process.cwd(),
        fileOpts.filename
      )}) cannot accept arguments because it does not export a function. You passed the arguments: ${args.join(
        ", "
      )}`
    );
  }

  // Convert whatever we got now (hopefully a string) into AST form
  if (typeof module !== "string") {
    // console.log(typeof module);
    throw new Error("codegen: Must module.exports a string.");


  }
  return babel.template(module, {
    preserveComments: true,
    placeholderPattern: false,
    ...fileOpts.parserOpts,
    sourceType: "module"
  })();
}

seems @babel/plugin-transform-template-literals caused this issue, i have tested them one by one and combinations;

node_modules/@babel/preset-env/lib/index.js

const pluginOfPresetEnv =[];
for(let key of transformations .keys()){
  pluginOfPresetEnv.push(key)
}
console.log('pluginOfPresetEnv',pluginOfPresetEnv)
  //pluginOfPresetEnv [
    //   'transform-template-literals',
    //   'transform-literals',
    //   'transform-function-name',
    //   'transform-arrow-functions',
    //   'transform-block-scoped-functions',
    //   'transform-classes',
    //   'transform-object-super',
    //   'transform-shorthand-properties',
    //   'transform-duplicate-keys',
    //   'transform-computed-properties',
    //   'transform-for-of',
    //   'transform-sticky-regex',
    //   'transform-dotall-regex',
    //   'transform-unicode-regex',
    //   'transform-spread',
    //   'transform-parameters',
    //   'transform-destructuring',
    //   'transform-block-scoping',
    //   'transform-typeof-symbol',
    //   'transform-new-target',
    //   'transform-regenerator',
    //   'transform-exponentiation-operator',
    //   'transform-async-to-generator',
    //   'proposal-async-generator-functions',
    //   'proposal-object-rest-spread',
    //   'proposal-unicode-property-regex',
    //   'proposal-json-strings',
    //   'proposal-optional-catch-binding'
  // ]


  let pluginOfPresetEnvArray =[

        // 'transform-template-literals',
      'transform-literals',
      'transform-function-name',
      'transform-arrow-functions',
      'transform-block-scoped-functions',
      'transform-classes',
      'transform-object-super',
      'transform-shorthand-properties',
      'transform-duplicate-keys',
      'transform-computed-properties',
      'transform-for-of',
      'transform-sticky-regex',
      'transform-dotall-regex',
      'transform-unicode-regex',
      'transform-spread',
      'transform-parameters',
      'transform-destructuring',
      'transform-block-scoping',
      'transform-typeof-symbol',
      'transform-new-target',
      'transform-regenerator',
      'transform-exponentiation-operator',
      'transform-async-to-generator',
      'proposal-async-generator-functions',
      'proposal-object-rest-spread',
      'proposal-unicode-property-regex',
      'proposal-json-strings',
      'proposal-optional-catch-binding'

  ]

transformations.forEach(pluginName => {
  if(pluginOfPresetEnvArray.includes(pluginName)){
  const config  ={ spec,loose, useBuiltIns: pluginUseBuiltIns}
  plugins.push([getPlugin(pluginName), config])
  }
});
const regenerator = transformations.has("transform-regenerator");

here is the key codes :
https://github.com/babel/babel/blob/master/packages/babel-plugin-transform-template-literals/src/index.js#L96

after this step, the codegen function visitor dead

from babel-plugin-codegen.

Related Issues (17)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.