Code Monkey home page Code Monkey logo

evcodeshift's Issues

babel error Transformation error (Missing initializer in const declaration)

Hello,
I'm getting an error when running evcodeshift.

Processing 1 files... 
Spawning 1 workers...
Sending 1 files to free worker...
 ERR /Users/e/test1-provider.tsx Transformation error (Missing initializer in const declaration. (16:26))
SyntaxError: Missing initializer in const declaration. (16:26)
    at instantiate (/Users/eransakal/dev/github-public/xstate-hive/node_modules/@babel/parser/src/parse-error/credentials.ts:62:21)
    at toParseError (/Users/eransakal/dev/github-public/xstate-hive/node_modules/@babel/parser/src/parse-error.ts:60:12)
    at JSXParserMixin.raise (/Users/eransakal/dev/github-public/xstate-hive/node_modules/@babel/parser/src/tokenizer/index.ts:1490:19)
    at JSXParserMixin.parseVar (/Users/eransakal/dev/github-public/xstate-hive/node_modules/@babel/parser/src/parser/statement.ts:1522:16)
    at JSXParserMixin.parseVarStatement (/Users/eransakal/dev/github-public/xstate-hive/node_modules/@babel/parser/src/parser/statement.ts:1166:10)
    at JSXParserMixin.parseStatementContent (/Users/eransakal/dev/github-public/xstate-hive/node_modules/@babel/parser/src/parser/statement.ts:537:21)
    at JSXParserMixin.parseStatementLike (/Users/eransakal/dev/github-public/xstate-hive/node_modules/@babel/parser/src/parser/statement.ts:417:17)
    at JSXParserMixin.parseStatementListItem (/Users/eransakal/dev/github-public/xstate-hive/node_modules/@babel/parser/src/parser/statement.ts:366:17)
    at JSXParserMixin.parseExportDeclaration (/Users/eransakal/dev/github-public/xstate-hive/node_modules/@babel/parser/src/parser/statement.ts:2534:17)
    at JSXParserMixin.maybeParseExportDeclaration (/Users/eransakal/dev/github-public/xstate-hive/node_modules/@babel/parser/src/parser/statement.ts:2453:31)
All done. 
Results: 
1 errors
0 unmodified
0 skipped
0 ok

The file content is

import React, { useState, useMemo, PropsWithChildren } from 'react';
import {
  Test1Machine
} from './types';
import { createTest1Machine } from './utils/create-test1-machine';
import { useMachine } from '@xstate/react';
import { createTest1MachineLogger } from './utils/logger';
import { Test1Context } from './utils/test1-context';
import { updateExternalInfo } from './machine-actions/context/update-external-info';
import { onExternalInfoChanged } from './machine-services/on-external-info-changed';
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const logger =  createTest1MachineLogger(
    'Test1Provider'
  );

export const Test1Provider: React.FC<PropsWithChildren> = ({ children }) => {
 
 const [machine] = useState(() => createTest1Machine());

  const [, , test1MachineService] = useMachine<Test1Machine>(machine, {
    actions: {
      updateExternalInfo 
    },
    services: {
      onExternalInfoChanged
     },
    guards: { },
  });


  const providerValue = useMemo(() => {
    return { test1MachineService };
  }, [test1MachineService]);

  return (
    <Test1Context.Provider value={providerValue}>
      {children}
    </Test1Context.Provider>
  );
};

Manually removing : React.FC<PropsWithChildren> will fix the babel error but it will not function correctly. For example running the method findUseMachineAssignment will not find the useMachine node unless I manually remove the generic type <Text1Machine>.

import {JSCodeshift, Transform} from 'jscodeshift'

function findUseMachineAssignment(j: JSCodeshift, ast: Collection<any>): j.VariableDeclarator | null {
  const assignment = ast.find(j.VariableDeclarator, {
    init: {
      callee: {name: 'useMachine'},
    },
  })

  if (assignment.length === 0) {
    // If assignment is not found, return null or handle the case accordingly
    return null
  }

  return assignment.at(0).get()
}

export const transform: Transform = (fileInfo, api, options) => {
  const j = api.jscodeshift
  const ast = j(fileInfo.source)

  const useMachineNode = findUseMachineAssignment(j, ast)

  console.dir(useMachineNode)
  return ast.toSource()
}

export default transform

Please advice
Thanks!
Eran

Add a "splice into" feature for Javascript/Typescript

Problem: once of the most common uses of codemods, at least for me, is to update data in configuration files that are written in Javascript/Typescript instead of in JSON. I want to have a way of updating these values in a way more reliable that regexes, but I don't want to have to crack open a text editor and write a brand new set of code just to change to settings in a file.

Solution: give evcodeshift the ability to act as a simple command line utility where you can use the shell to pass evcodeshift a property name and a string with javascript code, and evcodeshift will replace the value at that property name with the new bit of code.

Here's how I envision this feature working. Let's say we have a file named my_config_file.js with the following content

let myconfigData = 
{
    "mobileID": "23423",
    "environments": {
        "ios": {
            "provisioning_profiles": [
                "15613CEFSGA",
                "235613CEFSGA",
                "AE6116341454"
            ]
        },
        "android": "8675309D",
        "electron": "ABEEF26401"
    }
}

I'd like to run the following commands on the shell to change the values of "electron" and "provisioning_profiles"

evcodeshift --edit my_config_file.js "electron" "DECAFBAD" 
evcodeshift --edit my_config_file.js "provisioning_profiles" "[\"111111\", \"22222\", \"333333\"]"

The new content of my_config_file.js look something like

let myconfigData = 
{
    "mobileID": "23423",
    "environments": {
        "ios": {
            "provisioning_profiles": [
                "111111",
                "22222",
                "333333"]
            ]
        },
        "android": "8675309D",
        "electron": "DECAFBAD"
    }
}

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.