loopbackjsloopback4

How to remove all frontend files from Loopback app

While developing on a loopback api it is very convenient that the default lp4 app command generates a simple landing page with a swagger api explorer.

But I don't want this when I am finished. where in the code do I disable the self hosted pages, and which files should I delete to remove irrelevant files in my project?

Solution

  • There are 4 artifacts that you may want to individually disabled/removed:

    1. Default / landing page: The default page that links to openapi.json and the API explorer.
    2. Externally-hosted REST explorer redirect: A redirect from /swagger-ui and /explorer to a REST explorer that's hosted elsewhere (e.g. https://explorer.loopback.io).
    3. Self-hosted REST explorer: A REST explorer served at /explorer. Takes precedence over hosted REST explorer redirect for /explorer path by default.
    4. OpenAPI spec endpoint: The OpenAPI 3.0 spec hosted at /openapi.json by default.

    Although the instructions here can be followed exactly for majority of LoopBack 4 projects, more customised projects may have certain things (e.g. application or component configuration) moved around.

    To remove the default / landing page:

    1. Remove the public directory

    2. Remove the following lines from src/application.ts:

      // Set up default home page
this.static('/', path.join(__dirname, '../public'));

    To disable externally-hosted REST explorer through configuration:

    1. In src/index.ts, configure config.rest.apiExplorer.disabled:

      const config = {
  rest: {
    apiExplorer: {
      disabled: true,
    },
  },
};

    To completely remove self-hosted REST explorer:

    1. Remove the following lines from application.ts:

      // Customize @loopback/rest-explorer configuration here
this.configure(RestExplorerBindings.COMPONENT).to({
  path: '/explorer',
});
this.component(RestExplorerComponent);

    2. Uninstall @loopback/rest-explorer

    To disable the OpenAPI spec endpoint through configuration:

    1. In src/index.ts, configure config.rest.openApiSpec.disabled:

      const config = {
  rest: {
    openApiSpec: {
      disabled: true,
    },
  },
};

    Note that disabling the OpenAPI spec endpoint would prevent the REST explorers from working correctly as they are dependent on an web browser-accessible OpenAPI spec.

    Disabling the OpanAPI spec endpoint does not disable access to the OpenAPI spec from within TypeScript nor does it affect AJV validation.

    References