Giter Club home page Giter Club logo

meteor-async-migration's Introduction

meteor async migration

This tool helps us to migrate existing codebase to support new async API in Meteor version 2.8 and later.

Hopefully he's okay.

hopfully he survive

Install jscodeshift toolkit

What is jscodeshift? https://github.com/facebook/jscodeshift Linux: Run sudo npm install -g jscodeshift

Features

Note: if you have .ts files, you'll need to add --extensions=ts,js to the command

1: Convert current APIs to new Meteor Async/Await APIs

Transform file: transform.ts It will convert the current sync function call (using Fiber) to new async APIs. e.g: convert Links.findOne() to await Links.findOneAsync() It also convert the function which uses these new async apis to async function.

Command: DEBUG="transform:print*" jscodeshift -t transform.ts YOUR_CODEBASE_DIR --parser=tsx

ATTENTION: Only run this script against your Server APIs. You should not convert the front-end UI to use these new async functions.

2: Scan for async function usages

Transform file: transform-use-async-functions.ts

After you converted some sync functions to async. Now you need to find where you use them, and add await to those call expressions. The script will also convert those functions which have await expression to async function.

Command: DEBUG="transform:print*" jscodeshift -t transform-use-async-functions.ts YOUR_CODEBASE_DIR --parser=tsx

You may need to run more than one time until you got no modified file.

3: Handle async function export/import

Transform file: transform-export-async-function.ts

After you converted your functions to async, you may exported some async functions, you must scan you codebase, find all async function imports, work with those function calls (add await expression), and change the function which has those calls (add async expression).

Command: DEBUG="transform:print*" jscodeshift -t transform-export-async-function.ts YOUR_CODEBASE_DIR --parser=tsx

You may need to run more than one time until you got no modified file.

4: Convert Meteor.call to Meteor.callAsync

Transform file: transform-meteor-call.ts

It will look for Meteor.call() which doesn't have callback function arguments, and not followed by .then() expression. Convert it to await Meteor.callAsync(). It will also change the parent function to async. That's why you may want to run the transform #2 and #3 again.

Command: DEBUG="transform:print*" jscodeshift -t transform-meteor-call.ts YOUR_CODEBASE_DIR --parser=tsx

5: Work with React Components props

Transform file: transform-component-props.ts

Looks for async function passed to React Components via props. Find all those usages then add async/await expression to. It also works with the child components and handle some simple React Context usages. You may want to run #2 again.

Command: DEBUG="transform:print*" jscodeshift -t transform-component-props.ts YOUR_CODEBASE_DIR --parser=tsx

6: React Components - withTracker

Transform file: transform-component-props-withTracker.ts

If you use withTracker to wrap your react components, you may want to run this script. It will find the async functions inside the withTracker function prop then works with the react component which wrapped in withTracker call. You may want to run #2 after this.

Command: DEBUG="transform:print*" jscodeshift -t transform-component-props-withTracker.ts YOUR_CODEBASE_DIR --parser=tsx

7: Other transforms

While converting the codebase, I had some issues so I wrote some transforms to handle those issue:

  • Rename function: transform-rename-functions.ts
  • Remove async from function which doesn't have await expression inside: transform-fix-async-overly.ts
  • Find await expression inside a NOT async function: transform-find-await-without-async.ts
  • Promise.all doesn't work with forEach. This transform find all of them: transform-find-promise-all-foreach.ts

Run against sample files

  • npm run debug:samples
  • npm run debug:sample:methods
  • npm run debug:sample:publications
  • npm run debug:sample:utils
  • npm run debug:handle-async-import:samples

Run against your codebase

ATTENTION: You might want to modify these files to fit your code base:

  • constants.ts, modify the METEOR_ROOT_DIRECTORY value.

Use jscodeshift command directly Run with --dry -p options to test if the scrip works Run jscodeshift --help for more information

Meteor Developer

meteor-async-migration's People

Contributors

minhna avatar

Stargazers

Guillaume Darbonne avatar Anne Thorpe avatar  avatar Gabriel Grubba avatar  avatar Nathan Muir avatar Victor Parpoil avatar Jan Dvorak avatar vitor avatar Edwin van Ouwerkerk Moria avatar Jordan Brant Baker avatar Christian Wahle avatar  avatar G avatar

Watchers

 avatar Victor Parpoil avatar

meteor-async-migration's Issues

mapAsync is not a function error while using

Hello,
I'm testing the script and ai got this error:

LOGS
 ERR ../.meteor/local/bundler-cache/scanner/web.browser.legacy/reify-5a065996604b2eb9ace1f983694e85102d619fcf.js Transformation error (rootCollection.find(...).mapAsync is not a function)
TypeError: rootCollection.find(...).mapAsync is not a function
    at module.exports (/Users/vitorsouza/Desktop/work/dashboard/jscodeshift/transform.ts:288:49)
 ERR ../.meteor/local/bundler-cache/scanner/web.browser.legacy/reify-5a455a810648bbea7c617121c3ede4b9702ccb8d.js Transformation error (rootCollection.find(...).mapAsync is not a function)
TypeError: rootCollection.find(...).mapAsync is not a function
    at module.exports (/Users/vitorsouza/Desktop/work/dashboard/jscodeshift/transform.ts:288:49)
 ERR ../.meteor/local/bundler-cache/scanner/web.browser.legacy/reify-4c4ac0ddb15ed59aaa59838c3bffd05e146260c1.js Transformation error (rootCollection.find(...).mapAsync is not a function)
TypeError: rootCollection.find(...).mapAsync is not a function
    at module.exports (/Users/vitorsouza/Desktop/work/dashboard/jscodeshift/transform.ts:288:49)
 ERR ../.meteor/local/bundler-cache/scanner/web.browser.legacy/reify-4c19c517a6fd8ec50813ce189e4c1446bdc22123.js Transformation error (rootCollection.find(...).mapAsync is not a function)
TypeError: rootCollection.find(...).mapAsync is not a function
    at module.exports (/Users/vitorsouza/Desktop/work/dashboard/jscodeshift/transform.ts:288:49)
 ERR ../.meteor/local/bundler-cache/scanner/web.browser.legacy/reify-4cd9149a10e9465400ab3117102bf969a79950d7.js Transformation error (rootCollection.find(...).mapAsync is not a function)
TypeError: rootCollection.find(...).mapAsync is not a function
    at module.exports (/Users/vitorsouza/Desktop/work/dashboard/jscodeshift/transform.ts:288:49)
 ERR ../.meteor/local/bundler-cache/scanner/web.browser.legacy/reify-56ce2ff9993ebbee7eaf1022b40bee1ea3aeb716.js Transformation error (rootCollection.find(...).mapAsync is not a function)
TypeError: rootCollection.find(...).mapAsync is not a function
    at module.exports (/Users/vitorsouza/Desktop/work/dashboard/jscodeshift/transform.ts:288:49)

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.