Starting the development server
This page provides instructions on how to start Caplin Trader 5’s development server.
Start the development server
To serve the application during development, follow the steps below:
-
From the root directory of your application, execute the command below to start a local web server:
yarn run start
-
Open Google Chrome and navigate to http://localhost:8080
Start the development server with HMR
CT5 supports Webpack’s Hot Module Replacement (HMR), which updates JavaScript modules while your application is running in a browser, without a full reload.
To start the development server with HMR enabled, follow the steps below:
-
From the root directory of your application, execute the command below:
yarn run start -- --hot
-
Open Google Chrome and navigate to http://localhost:8080
Troubleshooting build issues
This section describes common issues you may encounter when running yarn run build
or yarn start
.
Alias <name> not registered
WARN [aliases-plugin] <time>: Alias "<name>" not registered.
This warning is generated when your application references a Caplin Trader alias but has not declared in the file ~/src/config/aliases.js
which package provides the alias.
To resolve a missing alias warning, determine which Caplin package defines the alias, and copy the definition of the alias to your application’s ~/src/config/aliases.js
file.
For example, consider the code below which requires the Caplin Trader service caplin.event-service
:
const eventService = require("service!caplin.event-service");
The identifier caplin.event-service
is an alias, and unless a implementation for the alias is declared in the application’s src/config/aliases.js
file, yarn run build
and yarn start
will generate the following warning:
WARN [aliases-plugin] 02:46:30: Alias "caplin.event-service" not registered.
To resolve the missing alias registration in the example above, follow the steps below:
-
Use the
grep
command to search your application’snode_modules
directory for the Caplin package that defines the missing alias:$ grep -R --include=aliasProviders.js 'caplin\.event-service' node_modules node_modules/ct-services/aliasProviders.js: "caplin.event-service": function() {
The output from the command reveals that the
ct-services
package defines thecaplin.event-service
alias.On Microsoft Windows, the grep
command is available in Cygwin and the Bash shell of Git for Windows. -
Copy the alias definition for
caplin.event-service
fromnode_modules/ct-services/aliasProviders.js
to the object exported by your application’ssrc/config/aliases.js
file:File: node_modules/ct-services/aliasProviders.jsmodule.exports = { "caplin.log-store-service": function() { return require("ct-core/log/LogStoreService"); }, "caplin.event-service": function() { return require("ct-core/event/EventHub"); }, "caplin.config-service": function() { return require("./providers/CaplinConfigService"); }, "caplin.user-prompt-service": function() { return require("./providers/BrowserUserPromptService"); } };
File: src/config/aliases.jsmodule.exports = { "caplin.event-service": function() { return require("ct-core/event/EventHub"); } };