如何使用 web 服务器部署 Stencil App？

Question

I'm trying to learn how to deploy a Stencil web app using a web server like Ngnix but I can't make it work on localhost. I suspect there is no entry point for the minified build.

As an example, I'm using the stencil starter app.

In my stencil.config.ts file, I have opted-in for the "dist" output target.

outputTargets: [
  {
    type: 'www',
    // comment the following line to disable service workers in production
    serviceWorker: null,
    baseUrl: 'https://myapp.local/',
  },
  {
    type: 'dist'
  },
]

For the minified build I am running the command:

 npm run build -production

The generated "/dist" folder does not contain an index.html file and this prevents me from being able to serve it using Ngnix.

The contents of the dist folder

I would expect that the generated "/dist" folder would contain an "index.html" file that could be served as an entry point to a web server.
What am I doing wrong?
Is there anything I'm missing?

Answer 1

The dist output target is meant for including in existing pages.

To generate a website you can use the www output target (in the www folder). This will also give you access to website-specific options, like a service worker.

The docs state:

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.

Answer 2

For anyone who comes across this in the future, I found the solution.

I was supposed to use the "/www" folder for deployment as that's the way it's supposed to work for standalone web apps, and it contains an "index.html" file.

Here is the documentation