Automatic recognition of Meteor projects by detecting the .meteor folder and excluding the .meteor/local folder from project. See Hiding excluded files for details.
Attaching the predefined Meteor library to the project automatically. This enables syntax highlighting, resolving references, and code completion.
A dedicated complex Meteor run/debug configuration for debugging both the client-side and the server-side code within one debugging session, see Debugging a Meteor application.
Before you start
The installation procedure depends on the operating system you are using. Learn more from the Meteor official website.
Download the LaunchMeteor.exe installer at the Meteor official website.
Creating a new Meteor application
If you have no application yet, you can generate a PyCharm project with Meteor-specific structure from a Meteor boilerplate template. Alternatively, create an empty PyCharm project and configure Meteor support in it as described in Starting with an existing Meteor application below.
To create a Meteor project from a boilerplate template
In the right-hand pane:
Specify the location of the Meteor executable file (see Installing Meteor).
In the Filename field, type the name for the mutually related .js, .html, and .css files that will be generated. The field is available only if the Default sample type is selected from the Template drop-dow list.
To create an empty PyCharm project
Starting with an existing Meteor application
If you are going to continue developing an existing Meteor application, open it in PyCharm, configure Meteor in it, and download the required dependencies as described in Downloading Meteor dependencies below.
To open the application sources that are already on your machine
To check out the application sources from your version control
Click Check out from Version Control on the Welcome screen or select from the main menu.
Select your version control system from the list.
In the VCS-specific dialog that opens, type your credentials and the repository to check out the application sources from.
To configure Meteor support in an existing project
In the Settings/Preferences dialog (Ctrl+Alt+S), go to . The Meteor page opens.
Specify the path to the Meteor executable file. If you followed the standard installation procedure, PyCharm detects the file automatically.
To involve the .meteor/local folder and its contents in indexing, clear the Automatically exclude ".meteor/local" directory on open project checkbox. For details, see Hiding excluded files below.
Make sure the Automatically import Meteor packages as external library checkbox is selected.
When the checkbox is selected, PyCharm automatically imports the external packages from the meteor/packages file. As a result, PyCharm provides full range coding assistance: resolves references to Meteor built-in functions, for example,
check(true), and to functions from third-party packages, provides proper syntax and error highlighting, supports debugging with source maps, and so on.
When this checkbox is cleared, PyCharm does not automatically import the external packages from the meteor/packages file. As a result no coding assistance is provided. To improve the situation, open the meteor/packages file in the editor and click the Import packages as library link or run the
Make sure PyCharm has attached the Meteor library to the project.
Importing Meteor packages
Besides the predefined Meteor library that ensures basic Meteor-specific coding assistance, you can download additional packages that are defined in the .meteor/local/packages file.
To download additional Meteor packages
Open the .meteor/local/packages file in the editor.
Click the Import Meteor Packages link in the upper right-hand corner of the screen.
In the dialog that opens, specify the packages to download depending on the type of the application you are going to develop in your project.
Cordova: select this option to import the packages that support development of Meteor applications for iOS and Android, see Meteor Cordova Phonegap Integration for details.
To hide the .meteor/local folder
Click the button on the toolbar of the Project tool window and remove a tick next to the Show Excluded Files option.
Running a Meteor application
PyCharm runs Meteor applications according to a run configuration of the type Meteor. If you created your application from a boilerplate template, PyCharm generates a Meteor run configuration for you.
To create a Meteor run configuration
In the Configuration tab, specify the path to the Meteor executable file according to the installation (see Installing Meteor).
By default, the working directory is the project root folder.
In the Program Arguments field, specify the command line additional parameters to be passed to the executable file on start up, if applicable. These can be, for example,
--prodto indicate the environment in which the application is running (development, test, or production environments) so different resources are loaded on start up.
By default, PyCharm shows the application output in the Run tool window. To view the results of the client-side code execution, in the Browser / Live Edit tab select the After Launch checkbox and choose the browser to open from the list. In the field below, specify the URL address to open the application at. The default value is http://localhost:3000.
To run a Meteor application
View the application output in the Run tool window or in the browser if you configured the browser to open on application start as described above.
Debugging a Meteor application
Technically, several Meteor projects that implement different applications can be combined within one single PyCharm project. To run and debug these applications independently, create a separate run configuration for each of them with the relevant working directory. To avoid port conflicts, these run configurations should use different ports. In the Program Arguments field, specify a separate port for each run configuration in the format
To debug a Meteor application
Set the breakpoints in the code where necessary.
The Debug tool window opens showing two tabs: one for debugging the server-side code marked with and the other one for debugging the client-side code marked with .
Optionally, preview the changes to the application on the fly as described below.
Previewing changes in the browser
Elements tab of the Debug tool window. The update policy depends on which part of your application you are editing.
To preview changes to the client-side code, do one of the following:
To preview the changes to the server-side code, dop one of the following:
Switch to the <Configuration name> tab and click on the toolbar.