Stencil config generating files in dist that doesn't work standalone

I have started on stencil development and tried to create the hello world from it but while trying to build and deploy and use it stand alone the dist file is generating some random files which doesn't seem to work standalone.

I have published the files to npm and trying to run it standalone in a html file. Using unpkg https://unpkg.com/browse/rahulrsingh09-stenciltest2@0.0.2/dist/

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title></title>
  <meta name="author" content="">
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
 <my-component first="FF" last="'Don't call me a framework' JS"></my-component>
<script src='https://unpkg.com/rahulrsingh09-stenciltest2@0.0.2/dist/index.js'></script>
</body>
</html>

and this one is a test from a different package i found in npm and this seems to work .

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title></title>
  <meta name="author" content="">
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  
</head>

<body>

 <my-component first="FF" last="'Don't call me a framework' JS"></my-component>

<script src='https://unpkg.com/web-component-stencil-test@0.0.1/dist/test.js'></script>
</body>

</html>

The only difference i found is https://unpkg.com/browse/web-component-stencil-test@0.0.1/dist/

the dist contains a root file for the main of project which runs standalone but this is not generated in the new stencil config build. the documentation on this is very sparse , can some one point me what am i doing wrong.. here or something missing by stencil.

package.json

"name": "stenciltest2",
  "version": "0.0.2",
  "description": "Stencil Component Starter",
  "main": "dist/index.cjs.js",
  "module": "dist/custom-elements/index.js",
  "es2015": "dist/esm/index.mjs",
  "es2017": "dist/esm/index.mjs",
  "types": "dist/custom-elements/index.d.ts",
  "collection": "dist/collection/collection-manifest.json",
  "collection:main": "dist/collection/index.js",
  "unpkg": "dist/test/test.js",
  "files": [
    "dist/",
    "loader/"
  ],

stencil config

import { Config } from '@stencil/core';

export const config: Config = {
  namespace: 'test',
  buildEs5: true,
  outputTargets: [
    {
      type: 'dist',
      esmLoaderPath: '../loader',
    },
    {
      type: 'dist-custom-elements-bundle',
    },
    {
      type: 'docs-readme',
    },
    {
      type: 'www',
      serviceWorker: null, // disable service workers
    },
  ]
};