How to generate JavaScript files from CoffeeScript in IntelliJ IDEA? - intellij-idea

I'm trying out CoffeeScript support in IntelliJ, and although the highlighting/completion/refactoring support looks great, I can't figure out a way to automatically compile my .coffee files to their .js counterparts in order to use them in web pages, unit tests, etc.
The documentation mentions using Node for this purpose, but I'm primarily interested in writing client side code. I'd probably be able to create a run configuration that would use Cake to create my JS files, but this won't integrate nicely with IDEA's integrated unit test support, etc.
So... any help?


Use the IntelliJ IDEA plugin: File Watchers.
You would need to install coffee-script package in the global directory. (npm install -g coffee-script).
While you are editing the CoffeeScript file in IntelliJ editor, there would be a notification showing on the top.
Click "Add watcher" and the IDE will compile your code for you on the fly.
More advanced options could be accessed via Project Settings/File Watchers.
See also the official document.

Related

In IntelliJ, what inspection is "TS6053: File ... not found' and how can I run it on the whole project?

I think this is some kind of TypeScript plugin, but I don't know what it is.
I can't determine what it is based on my installed plugins. How can I run the analysis for whatever plugin this is on the whole project? Currently, I have to open each individual file and wait for it to run the mystery analysis.

This is a built-in Typescript language service; it can be turned on/off in Settings | Languages and Frameworks | TypeScript.
When using it, all dependent files are not sent to server on re-highlighting the current file - it would be too expensive. That's why highlighting is not updated until you open a file in editor. You can try using Compile All in TypeScript tool window to see all errors.
To have the errors from all files shown while editing, you can toggle Show project errors button in TypeScript tool window; but note that this would slow down the performance

IntelliJ Ctrl-Click on method and autocompletion in HTML doesn't work

I've started using IntelliJ for angular2 development recently but there seem to be a bug. I know from WebStorm that if I have following html:
<button (click)="onHaveClicked()">Button</button>
I should be able to jump to the method implementation in my typescript file using ctrl-click. But this shortcut isn't working at all. I've tried multiple different files.
Also autocompletion in html doesnt work at all. It's showing no angular attributes like ngFor etc. Angular2 is of course installed.
Was somebody with the same problem able to solve it?

IntelliJ doesn't come with Angular support built in. You can however enable it by installing the plugin. Settings -> Plugins -> Install Jetbrains Plugin -> Search for Angular.
This is a general thing with IntelliJ and the other editors. The specialized editors (like PhpStorm and WebStorm) comes with what you need for that editor by default. IntelliJ, which is more general, it often has to be installed manually.

PhpStorm .vue pug styling

Is anyone getting issues with syntax highlighting for .vue files within PhpStorm when using pug?
Is this something that it only available in WebStorm and not planning on coming to PhpStorm?
Within PhpStorm my view file looks like the following:
I have the following plugins installed:
.ignore, AngularJS, Apache config (.htaccess) support, ASP, BashSupport, Behat Support, Blade Support, Bootstrap 3, Codeception Framework, CoffeeScript, Color Ide, Command Line Tool Support, Copyright, CSS Support, CSSReorder (beta), CVS Integration, Database Tools and SQL, Docker integration, Drupal Support, EditorConfig, EJS, File Watchers, Gherkin, Git Integration, GitHub, GNU GetText files support (*.po), Go Lang Plugin, Google App Engine Support for PHP, Haml, hg4idea, HTML Tools, Ini4Idea, IntelliLang, JavaScript Debugger, JavaScript Intention Power Pack, JavaScript Support, Joomla! Support, Karma, Less support, Markdown Navigator, Markdown support, Material Theme UI, NodeJS, Perforce Integration, Performance Testing, Phing Support, PHP Docker, PHP Remote Interpreter, PHPSpec BDD Framework, PhpStorm Workshop, Pug (ex-Jade), QuirksMode, Refactor-X, Remote Hosts Access, REST Client, ReStructuredText Support, Sass support, Settings Repository, SSH Remote Run, Stylus support, Subversion Integration, Task Management, Terminal, TextMate bundles support, Time Tracking, tslint, Twig Support, UML Support, Vagrant, Vue.js, W3C Validators, WordPress Support, XPathView + XSLT Support, XSLT-Debugger, YAML
If I open the same file within WebStorm it highlights as expected.
Im running Phpstorm 2017.1.4 & Vue.js plugin is version 171.4424.63. I have removed the Vue.js plugin and re-installed it a number of times with no luck.

it works in PHPStorm just in the same way as in Webstorm:
from your screenshot it seems that you have the wrong (old) Vue.js plugin installed. what PhpStorm version do you work with?

Thanks #lena
Within (Settings | Editor | File Types) *.vue was not listed.
I had a section called Vue.js Templates but it empty with no Registered Patterns. Adding *.vue in there fixed my issue.
Thanks.

How to properly import a Play 2+ project in IntelliJ 14+ with all integrated features (run, debug, test)?

I work on a Java based Play! project for severals months now and I'd like to import it completely in IntelliJ, meaning being able to run, compile, test and debug from IntelliJ, without the need to use the command line.
According to this post from Jetbrain, it seems to be possible, if I quote the article it says clearly : "Now you don’t need to switch between IntelliJ IDEA and Play console anymore. Everything is available right from your favorite IDE.", but I can't figure out a way to achieve this for now, even if I follow the tutorial provided by Jetbrains.
Here are the steps I've been throught :
Open my fav IDE IntelliJ ;)
Go to the project list window.
Import project
Import from external model and choose SBT as suggested in Jetbrains tutorial.
option "Use auto import" checked, option "create directories for empty content roots automatically" checked. Project SDK Java 1.7
Global sbt settings : JVM From project JDK.
Finish
By now, if I try to make the project and launch it from IntelliJ, I'll get scala compiling errors related to routes object. Thanks to this post, we can understand that this happens because scala routes are located to specific folders that needs to be included in IntelliJ sources settings for this project. So next step was :
File -> Project Structure -> Modules
Add target/scala-2.10/classes:target/scala-2.10/resources_managed:target/scala-2.10/src_managed as sources folders.
But my problem remains the same, routes object being unrecognized.
Notes : I have no scala facets in my project structure configuration nor can add one.

IntelliJ provides integrated support for the Play Framework for Scala and Java. Support is currently only available in IntelliJ Ultimate Edition (see the Frameworks and Technology section).
Assuming Ultimate Edition, the setup for Play is incredibly easy. Simply create a new project by importing build.sbt, then choose Add Framework Support and choose Play 2.
Once complete, you can start and stop Play using the Play 2 Run/Debug configuration. No command line necessary.
Here is a more in depth look at IntelliJ's Play project configuration.

You could try the command play idea if you are using play or activator idea if you are using activator. That will do the magic.

Getting auto-completion to work in an IDE using Coffeescript and external Javascript libraries such as jQuery

I would like to ask how other more experienced Coffeescript developers are using their respective IDE's or editors with auto-complete when developing modular libraries and / or referencing external Javascript libraries (jQuery, jQuery UI, RequireJS, Handlebars, ...).
As much as I've tried various IDE's and plug-ins for Coffeescript, none of these seem to support auto-completion when the project consists of several script files. For example: in Visual Studio I can add a commented directive such as /// <reference path="/js/jquery.js" />. I'd need something similar for Coffeescript.
I have tried following without success:
Visual Studio with Web Workbench by Mindscape
Netbeans with dstepanov's Coffeescript plug-in
Aptana with the Coffeescript ruble
Further, I am aware of Jetbrain's WebStorm 3.x support for Coffeescript, unfortunately, my evaluation period expired before I realized I'd need this feature - can anyone confirm that setting the Javascript / Coffeescript Usage Scope works as expected with auto-complete?
So effectively what I am asking: is there an IDE or plug-in, commercial or otherwise, enabling auto-complete for Coffeescript libraries spanning multiple files?

Hate to answer my own question, but after giving JetBrains WebStorm 3.0.2 another demo run on another box, I figured it worked best and does have 'smarter than average' auto-complete for coffeescript projects. It simply loads all coffeescript files in to a global auto-complete context and you can add external libs (cs or js) as well using the project's scope settings. Could be better, but for now I cannot find any other IDE or tool running on PC or Linux, OSS or paid, that tops WebStorm and I don't have the fortunes to explore OSX alleys.
I am sure future tools, plugins, IDE's will pop up for various platforms that do offer great coffeescript module management and proper contextual auto-completion in the editor. So please, do keep the suggestions coming.
Thanks!

I personnaly use Kdevelop. I can't remember if I installed a plugins or something to get it work with coffeescript.
But it works very well, the highlighting colors are pretty, when ctrl+d it add coffeescript commentary and so on.
Also I do make compilation directly in KDevleop.
Well also it's free, I am using it on linux debian but I think it works on most platforms.
Check it there : http://kdevelop.org/