ellamaolson / ngmigration-assistant Goto Github PK
View Code? Open in Web Editor NEWAn analysis tool to determine which migration path from AngularJS to Angular is right for you.
An analysis tool to determine which migration path from AngularJS to Angular is right for you.
The component and controller counts presently assume that there is only 1 defined per file, but that's not a given. It should be counting all matches.
For example, my ES code base has the component and controller bodies exported. Module files then import them and feed them into the angular module.
angular.module('moduleName', [])
.component(Component1)
.component(Component2)
.controller(Controller1)
.controller(Controller2)
Naturally there are other valid approaches with multiple in a file that are fair game.
Hi all!
I really enjoy to see more projects related to the topic of AngularJS -> Angular migration. We all want to make jumping to the newer ship easier and faster. Since this project has much bigger chance to get more traction, I was wondering if it would be possible to integrate my toolkit with your solution.
As I see now, ngMigration-Assistant runs static analysis on top of given project to let you know which parts of it should be updated in order to work smoothly with newer Angular. While this knowledge is valuable, I think that we could automate whole process even more.
Few months ago I create two tools, which - I believe - could really enhance the current workflow of ngMigration-Assistant.
create-angular-template
is a library which runs a set of transformations on your AngularJS templates preparing them for the new syntax. ng-if
gets transformed into *ngIf
, ng-repeat
into *ngFor
, etc. All of this makes the process of manual updates much easier.
To make it even easier to use, I also created ng-up
, which is a CLI utility combined from create-angular-template
and yet another module responsible for preparing Anuglar providers for AngularJS services.
I believe it would be possible to somehow integrate both tools (at least create-angular-template
) to automate the migration process and reduce the amount of time you need to spend on it.
What do you think? I'm open for all kinds of suggestions.
did not return Angular version :(
The list of files is presented as those that need to be modified, but component pattern matches are included among them despite being a target pattern.
Probably not intended and makes for a lot of noise.
Can be achieved by converting to JS before analyze?
There are a number of libraries offering Angular-style @component() decorators and are very helpful tools in preparing for the migration. These could easily be factored into the component count. Since this tool handles hybrid apps, the trick is to be able to distinguish between the Angular and AngularJS flavors. I suggest testing for the the decorator along with the absence of the @angular/core import.
TypeScript definition files ending in *.d.ts match the *.ts pattern tested against. Worth examining as this may or may not be desirable.
First off - thanks for the efforts with this tool! It confirmed the path/approach we've been working on for our large angular applications. One of the items listed is to remove $rootScope from our application. For the most part we have done this, but we still use this in a couple services to execute some checks when the route changes by using $rootScope.$on('$routeChangeSuccess'. What would be the recommended way to move away from $rootScope but still be able to have a service execute code when a route changes?
We also have the same issue in that we also use $locationChangeSuccess to update some variables in Google Analytics (perhaps there is a better way to do this now, but it was the recommended approach at the time we wrote it).
Any thoughts/advice on how to handle this would be appreciated.
I tested it and realized that there is (besides a very general intro) no helpful documentation provided.
Neither --help nor the readme explains what the suggestions mean exactly.
Also, no tests are there. So I have no way to figure out the exact meaning of the suggestions.
I guess this is because of a very early stage of this repo.
Anyway, GREAT work!!!
Thanks for your effort,
Michael
Error 1: ```
{ Error: EISDIR: illegal operation on a directory, read
at Object.fs.readSync (fs.js:675:18)
at tryReadSync (fs.js:540:20)
at Object.fs.readFileSync (fs.js:583:19)
at AnalysisTool.testFile (/usr/local/lib/node_modules/ngma/bin/analysisTool.js:196:38)
at AnalysisTool.runAnalysis (/usr/local/lib/node_modules/ngma/bin/analysisTool.js:174:18)
at AnalysisTool.countLinesOfCode.then.sourceLines (/usr/local/lib/node_modules/ngma/bin/analysisTool.js:70:18)
at
at process._tickCallback (internal/process/next_tick.js:188:7) errno: -21, code: 'EISDIR', syscall: 'read' }
Output:
App Statistics
* **Complexity: 0 controllers, 0 AngularJS components,** 55 JavaScript files, and 0 Typescript files.
Not sure of the reasoning. I wouldn't think that you would have to worry much about JSON files in terms of the migration. My suggestion is to ignore them.
I'm probably missing something simple, but i get this on windows after doing the yarn add and trying to run ngma:
'ngma' is not recognized as an internal or external command,
I'm getting this error:
Error 1: Error: EISDIR: illegal operation on a directory, read
at Object.readSync (node:fs:723:3)
at tryReadSync (node:fs:433:20)
at Object.readFileSync (node:fs:479:19)
at AnalysisTool.testFile (C:\Users\maxim\AppData\Local\nvs\node\16.13.0\x64\node_modules\ngma\bin\analysisTool.js:196:38)
at AnalysisTool.runAnalysis (C:\Users\maxim\AppData\Local\nvs\node\16.13.0\x64\node_modules\ngma\bin\analysisTool.js:174:18)
at C:\Users\maxim\AppData\Local\nvs\node\16.13.0\x64\node_modules\ngma\bin\analysisTool.js:70:18
at runMicrotasks (<anonymous>)
at processTicksAndRejections (node:internal/process/task_queues:96:5) {
errno: -4068,
syscall: 'read',
code: 'EISDIR'
}
After debugging, found that this is because I have a folder named au_dcr.json
.
Please add an ignore parameter because the tool currently scans files in my bower_components
folder.
Example:
ngma --ignore './bower_components/'
Hi,
After installing ngma with npm install -g ngma I tried to run it on a old angularJS project.
Unfortunately I get this error:
`/usr/local/lib/node_modules/ngma/bin/analysisTool.js:112
allIgnoreGlobs = [...gitignore(rootpath + "/.gitignore"), ...defaultIgnoreGlobs].filter((pattern) => {
^^^
SyntaxError: Unexpected token ...
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:374:25)
at Object.Module._extensions..js (module.js:417:10)
at Module.load (module.js:344:32)
at Function.Module._load (module.js:301:12)
at Module.require (module.js:354:17)
at require (internal/module.js:12:17)
at Object. (/usr/local/lib/node_modules/ngma/bin/main.js:11:24)
at Module._compile (module.js:410:26)
at Object.Module._extensions..js (module.js:417:10)
`
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.