DocsResourcesBlog

Webapp Output Target: www

The www output target type is oriented for webapps and websites, hosted from an http server, which can benefit from prerendering and service workers, such as this very site you're reading. If the outputTarget config is not provided it'll default to having just the www type.

Even if a project is meant to only build a reusable component library, the www output target is useful to build out and test the components throughout development.

outputTargets: [
  {
    type: 'www'
  }
]

Config

Property Description Default
baseUrl The baseUrl represents the site's "base" url to be served from. For example, this site's base url is https://stenciljs.com/. However, if the entire site's output is to live within a sub directory, then this directory's path should be the baseUrl. For example, Ionic's documentation is a stand-alone Stencil site that lives in the /docs directory within https://ionicframework.com/. In this example, https://ionicframework.com/docs/ would be the base url. /
buildDir The buildDir is the directory of Stencil's generated scripts, such as the component files. For production builds, this directory will contain both es5 and esm builds for each component. (Don't worry, users only request the one their browser needs.) build
dir The dir config specifies the public web distribution directory. This directory is commonly the root directory of an app to be served, such as serving static files from. This directory is built and rebuilt directly from the source files. Additionally, since this is a build target, all files will be deleted and rebuilt after each build, so it's best to always copy source files into this directory. It's recommended this directory is not committed to a repository. www
empty By default, before each build the dir directory will be emptied of all files. However, to prevent this directory from being emptied change this value to false. true
indexHtml The indexHtml property represents the location of the root index html file. index.html
serviceWorker The serviceWorker config lets you customize the service worker that gets automatically generated by the Stencil compiler. To override Stencil's defaults, set any of the values listed in the Workbox documentation.
BackNext
Contributors