Expand my Community achievements bar.

Join expert-led, customer-led sessions on Adobe Experience Manager Assets on August 20th at our Skill Exchange.
SOLVED

How to export AEM Project from VS Code to AEM?

Avatar

Level 8

Hi all,

 

I imported my AEM project in to VS Code IDE.

 

It has the below structure:

MyProject-1

    core

    it.tests

    it.launcher

    ui.apps

    ui.dev

    etc

 

I installed the below extensions in VS Code:

1. Extension Pack for Java
2. VS Code AEM Sync
3. Language Support for HTL

 

I want to export MyProject-1 to my AEM Author.

 

When I right click MyProject-1, I do not get an option to export to AEM.

But this option is there for all the subfolders like core and it.tests.

 

Kindly suggest how to export MyProject-1 to my AEM Author.

 

Appreciate al your responses.

 

Thanks,

RK.

Topics

Topics help categorize Community content and increase your ability to discover relevant content.

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

@nsvsrk 

The reason you don’t see the “AEM: Sync” option on the project root folder (eg. MyProject-1) is because AEM VS Code extensions like Adobe AEM Sync or Vault CLI integrations are designed to target specific content modules - typically:

  • ui.apps

  • ui.content

  • ui.config

  • or any module that directly maps to /apps, /content, or /conf in AEM

These folders contain JCR content or client libraries that can be vault-synced (vlt rcp style) or pushed to AEM using vlt or aem:sync.

What you can do

If you want to sync from VS Code UI without going into the terminal:

  1. Right-click the ui.apps (or other content folder)
    → Choose “AEM: Sync” or “Deploy to AEM” (depending on the extension you're using)

  2. Configure a .vscode/settings.json at the project level to define your default sync targets.
    Example:

    {
      "aem.sync.target": "http://localhost:4502",
      "aem.sync.root": "ui.apps"
    }
  3. Install Tasks in VS Code
    You can define a VS Code Task that runs mvn clean install -PautoInstallPackage or even a sync script, and then invoke it from the Command Palette or the Run Task menu.

Why it’s not supported for the entire parent folder

The parent project (MyProject-1) is a Maven aggregator and doesn’t directly contain syncable content. The sync operations are context-specific to folders that map to actual JCR paths, and that’s why the UI option is intentionally scoped.


Santosh Sai

AEM BlogsLinkedIn


View solution in original post

5 Replies

Avatar

Level 8

Let me put my question in a different way:

My project code has the below structure:

MyProject-1

    core

    it.tests

    it.launcher

    ui.apps

    ui.dev

    etc

 

How to import in to VS Code?

 

I am aware that in order to import in to Eclipse, we need process it first.

 

Thanks,

RK.

Avatar

Community Advisor

Hi @nsvsrk,

Fortunately, VS Code does not require any preprocessing like Eclipse does.

Steps to Import an AEM Maven Project into VS Code
  1. Install the necessary VS Code extensions:

  2. Open the project root:

    • In VS Code, go to FileOpen Folder…

    • Select the root folder MyProject-1 (which contains the parent pom.xml)

  3. Let VS Code detect the Maven modules:

    • VS Code will automatically detect the modules (core, ui.apps, etc.) from the parent pom.xml

    • You should see a "Maven" tab in the sidebar listing all modules and their lifecycle phases (clean, install, package, etc.)

  4. Build the project (optional):

    • Open the Terminal (Ctrl + ~) and run: mvn clean install -PautoInstallPackage

      or run lifecycle phases using the Maven tab in VS Code.

  5. Explore and code:

    • You can now write code, debug, refactor, and use Java + Maven features like in Eclipse or IntelliJ.

Notes:
  • You don’t need to run mvn eclipse:eclipse or generate .project or .classpath files.

  • If your core module uses OSGi annotations (like @Component), make sure your Java version and classpath are set up correctly in VS Code settings.

  • You can set breakpoints and debug using VS Code’s built-in Java debugger (requires correct run configuration).


Santosh Sai

AEM BlogsLinkedIn


Avatar

Level 8

Thanks @SantoshSai .

 

Build the project (optional): I understand running from Terminal is equivalent to running from command line.

 

Is it not possible to AEM sync from project name folder in VS Code? Why this option is not there?

It is there for all sub folders.

 

I want to do everything from UI itself.

 

Thanks,

RK.

Avatar

Correct answer by
Community Advisor

@nsvsrk 

The reason you don’t see the “AEM: Sync” option on the project root folder (eg. MyProject-1) is because AEM VS Code extensions like Adobe AEM Sync or Vault CLI integrations are designed to target specific content modules - typically:

  • ui.apps

  • ui.content

  • ui.config

  • or any module that directly maps to /apps, /content, or /conf in AEM

These folders contain JCR content or client libraries that can be vault-synced (vlt rcp style) or pushed to AEM using vlt or aem:sync.

What you can do

If you want to sync from VS Code UI without going into the terminal:

  1. Right-click the ui.apps (or other content folder)
    → Choose “AEM: Sync” or “Deploy to AEM” (depending on the extension you're using)

  2. Configure a .vscode/settings.json at the project level to define your default sync targets.
    Example:

    {
      "aem.sync.target": "http://localhost:4502",
      "aem.sync.root": "ui.apps"
    }
  3. Install Tasks in VS Code
    You can define a VS Code Task that runs mvn clean install -PautoInstallPackage or even a sync script, and then invoke it from the Command Palette or the Run Task menu.

Why it’s not supported for the entire parent folder

The parent project (MyProject-1) is a Maven aggregator and doesn’t directly contain syncable content. The sync operations are context-specific to folders that map to actual JCR paths, and that’s why the UI option is intentionally scoped.


Santosh Sai

AEM BlogsLinkedIn


Avatar

Community Advisor

Hi @nsvsrk ,

Try below steps: