Visual Studio Code Extension

webOS OSE provides a Microsoft Visual Studio Code Extension to help developers easily create webOS OSE apps/services (web apps, Enact apps, JS services).

Note
This page only describes the overview of the extension. For more details, see the extension help in the marketplace.

Key Features

webOS OSE VS Code extension provides the following key features:

  • Creating web apps, Enact apps, or JS services from a template
  • Assisting the use of webOS LS2 APIs and Enact APIs through content assist
  • Debugging the implementation
  • Previewing an app locally
  • Running ESLint on Enact apps
  • Packaging, installing, and running apps
  • Configuring and managing VirtualBox emulator
  • Analyzing IPKs

How to Install

To install the extension, open Microsoft Visual Studio Code and do the following:

  1. Navigate to View > Extensions.
  2. Search for webOS OSE in the search bar and click the Install button. Once the installation is complete, you will see the webOS OSE icon webos OSE icon in the Activity bar in the Activity bar.
  3. Click the icon to see the user interface of the extension:

How to Use

The extension is designed on the basis of the typical flow followed in webOS OSE app/service development.

For help on using the extension, see Using the Extension in the extension help (on marketplace).

FAQs

Q. What are the different types of projects that can be created in the webOS OSE extension?

A. A brief description of the different projects:

  • Basic Web App: Creates a sample HTML "hello world" app that has a standard webOS OSE file system.
  • Hosted Web App: Creates a sample HTML app with an example to show some external page in-app with standard webOS OSE file system.
  • Web App Info: A dummy web app, which contains only appinfo file to use with any already developed HTML app.
  • Basic Enact App: Creates an enact Sample app as per selected template.
  • JS Service: A simple JS service with a service file.
  • JS Service Info: A dummy service info directory, which is used for reference of standard service information.
Q. What are the different operations that can be performed on the apps?

A. A brief description of the operations:

  • Package App: Packages the app into an IPK.
  • Install App: Install IPK on the device.
  • Run App: Runs the app on the device.
  • Local Preview: Provides a local preview of an app.
  • Install webOS: Installs the package to allow invocation of webOS LS2 APIs.
  • Run Lint: Runs ESLint for Enact apps.
  • Debug App/Service: Debugs apps and services in IDE.
  • Emulator Manager: Manages emulators directly on IDE.
Q. When must the webOS library be added to a project?

A. The webOS library is required when it is required to invoke webOS LS2 APIs in the app/service.

Q. I have not added any device in the KNOWN DEVICE pane, yet I can see an entry named emulator.

A. Emulator is a default entry that is shown. It is associated with the emulator that is running on the local system. If an emulator instance is not already set up, go to the EMULATOR MANAGER pane and add the emulator instance.

Q. Getting an error while packaging the app, when my folder path contains special characters.

A. Workspace path and name should not contain any escape or special characters, it can trigger errors on add, package, install operations.

Q. How to recover from some of the errors that are shown in the notification area messages?

A. A list of the errors:

Error

Description

ERROR! Failed to get the device list.

Some dependent packages are not available on the local system.

To resolve this issue, install the packages either manually or by clicking Yes when prompted (if you previously closed the prompt without installing, click the refresh button in the KNOWN DEVICE pane to get prompted again).

ERROR! Failed to list the applications installed on <device>

The device is not running.

ERROR! Failed to list the applications running on <device>

The device is not running.

ERROR! Please check IP address or port of <device>

The device is not reachable.

ERROR! Packaging App Failed. Details As follows: <errMsg>

Failed to package the app due to one of the following:

  • Check the ID format. Only lowercase letters(a-z), digits(0-9), minus signs, and periods are allowed.
  • Check the version format. It should be something like 1.0.0.
  • Only a valid app can be packaged. Make sure the directory includes 'appinfo.json'.
  • Some dependent resources (such as images, libraries, and modules) that are required for the project are missing. Add manually or through the npm command.

Contents