Support for babel-plugins

[vramana]

No description provided.

[gandm]

I will look at adding this. In the meantime use a babelrc file.

[vramana]

I have a babelrc file that has plugins mentioned in it and whenever I save, I get a transpile error saying unknown plugin. https://github.com/rackt/react-router This is the repository I am working on.

[gandm]

What is the plugin you are using?

[vramana]

https://github.com/babel-plugins/babel-plugin-object-assign

[gandm]

OK I see what babel-core is doing. You have to install a local copy of babel-plugin-object-assign in the atom path somewhere. Just adding it as a global using npm -g install won't work. go to a directory in the actual atom path and install it using npm install babel-plugin-object-assign and it will work.

[gandm]

Plugins may be a problem as the Atom environment is a self contained nodejs app. If plugins are required they must be installed within the atom exe path as a local package or atom must know of it via a sym link. Using links something like this - https://atom.io/docs/v0.211.0/behind-atom-developing-node-modules

So I'm closing this as it works if using .babelrc files and local packages.

[vramana]

The linter-eslint package uses plugins perfectly fine that are installed inside node_modules folder in the project directory. Can you look into this one more time? See how they handle plugin support for eslint in the linter.

Regardless, I think this is a great package. Thanks a lot !! Can't express how much I love this package.

Do you have any plans to add snippets for the common html tags??

I didn't configure transpile output to folder. So I always get a notification No transpile output configured. It just doesn't go until the timeout. Can you add an option to supress it ?? If I send PR will you merge it ??

[gandm]

Nothing I can do about how babel-core handles plugin dependencies in regard to .babelrc files. Babel-core itself reads the plugin name and attempts to resolve it. I'm not even aware of what is in the babelrc files. The only way I could do something is if I provide another config array in the settings and then use a kludge like linter which would work. My inclination is not to bother as most people would prefer to use .babelrc. However it's very quick to just add the plugin to the atom path and this works fine.

Haven't thought about snippets. I find they tend to be quite personal and are easy to create.

I can add a line that checks the existing supress on save messages option to disable the 'no output configured' message if that helps?

[vramana]

I can add a line that checks the existing supress on save messages option to disable the 'no output configured' message if that helps?

By all means please do. It blocks me from changing the tabs all the time.

[vramana]

Haven't thought about snippets. I find they tend to be quite personal and are easy to create.

Whenver I type div tag or ul or anything else. By pressing tab, I just want it to get the opening and closing tags autocompleted by the package itself. I believe that this is common to everyone.

[vramana]

linter-eslint gives an option to use eslint from node_modules/.bin/ I think that's how they resolve plugins I guess. Can you do the same?

If you find babel in node_modules/.bin/ give an option to using that instead of the one provided by the package.

[gandm]

language-babel 0.8.1 just published that suppresses 'no output configured' messages.

The html tags are specific to React and not babel ( babel just happens to support react ). If React is key then it may be better waiting for the Facebook Nuclide project - I'm guessing most people will use Nuclide. http://nuclide.io/ when it ships.

As I said. the babel-core code resolves plugins not my code. Babel-core reads the babelrc files and uses the options. My code has no part in this and as I don't read the files I can't know what plugins are even being used. If you're interested the two babel files involved in this are:-

https://github.com/babel/babel/blob/master/src/babel/util.js and
https://github.com/babel/babel/blob/050bcec617117e21e240858edf310ff25bfa8d95/src/babel/transformation/file/plugin-manager.js

[gandm]

P.S. Yes I could do what linter does and spawn npm to find out where node is but as I said it's a bit of a kludge. Not something I really want to do.

[vramana]

@gandm Anyway Thanks a lot!!

[HeyHugo]

I think I'm experiencing this same issue
Unknown plugin "react-transform"
on saving files for this project https://github.com/gaearon/react-transform-boilerplate
I tried installing the plugin in atom path (is it same as apm?) but without succes.

[vramana]

@HeyHugo I am also using "react-transfrom" plugin. It works perfectly fine for me. May it is a problem with environment variables. I am on Ubuntu 14.04. What is your system?? Have you tried opening atom from your terminal?

[HeyHugo]

@vramana Thanks for helping me troubleshoot. I'm on OS X Yosemite. Running atom from terminal works perfectly fine. Have you tried the repo I linked to with language-babel?

(still having the same problem :/ )

[vramana]

I am using the same setup in my own app. It works properly fine for me. If change the plugin-name to somthing else, language-babel complains to me that plugin is not found. So, it is checking my local packages as far as I know.

[gandm]

@HeyHugo It works for me. I use Windows so don't know about OS X. On windows babel-core searches in the following node-modules directories for plugins.

C:\Users\username\AppData\Local\atom\app-1.0.11\node_modules
C:\Users\username\AppData\Local\atom\node_modules
C:\Users\username\AppData\Local\node_modules
C:\Users\username\AppData\node_modules
C:\Users\username\node_modules
C:\Users\node_modules
C:\node_modules

I cd to C:\Users\username\AppData\Local\atom and then did a npm install babel-plugin-react-transform

I then added the following to my .babelrc

{
  "plugins": ["react-transform"]
}

Worlked for me.

[HeyHugo]

@gandm Thanks for taking time troubleshooting with me =)

I think the corresponding path on OS X is
/Applications/Atom.app/Contents/Resources/app/apm
Here I have installed the plugin with npm install babel-plugin-react-transform but I still get the unknown plugin error in atom.

I'll try and see if I have the same problem on my windows PC later.

[gandm]

Maybe try it in a less specific folder - the apm folder seems wrong to me. Try going to /Applications/Atom.app and doing the npm install there.

[HeyHugo]

Tried multiple parent folders too now with same result. The reason I tried the apm folder was that it already had a package.json + node_modules folder I figured that could work.

Trying this on windows machine soon.

[gandm]

If you can't solve it I can tell you how to use chrome inspector to debug Babel-core to find out where it is looking. Let me know.

[HeyHugo]

On windows - no problems.

Yeah I'm having a look at the chrome inspector now.

found that some files seems to be loaded from:
/Users/hugo/.atom/packages/

So I've tried installing babel-plugin-react-transform there and down the tree on some places without success.

[gandm]

Before going through inspector to see what Babel-core is actually using you might want to just console.log(process.cwd()); that is normally where Babel looks. This may not always be the case, and if not I will put together some screenshots to explain where to debug it.

[gandm]

Save a babel file first to get the error and preload babel-core then Using Inspector

Search for babel-plugin- and open the file plugin-manager.js

breakpoint here

Trace into to here and trace into line 23

Breakpoint here

Look at scope variables which show the search paths

[HeyHugo]

Thanks for all this help, it's really kind of you. This is what's in my "paths" array looks like so something seems off.

I recently installed nvm so I could tryout io.js maybe this has broken my node/npm somehow. I'll try remoe it and reinstall node and see if it helps.

[vramana]

@HeyHugo I use node through nvm. So, it shouldn't have any effect.

[HeyHugo]

I installed the plugin to the very root now (creating "/node_modules") and that solves the problem. It doesn't feel so good having a node_modules there but hey it works =)

Anyways, thanks for all the help, language-babel is a great package.