[Bug]: Changes needed post init for successful storybook and build runs

[tekante]

Describe the bug

This issue is to document changes made post init to allow for a successful execution of yarn run start and yarn run build. Successful as defined by completion of the process without an error code return. Detailed examination of results was not conducted.

To Reproduce
Steps to reproduce the behavior:

1. Run npx @phase2/outline-cli@latest init -a -s issue-repro
2. cd issue-repro
3. Run yarn run start
4. See error
5. Run yarn run build
6. See error

Expected behavior
A storybook instance successfully builds and launches with yarn run start

A full build completes successfully with yarn run build

Screenshots
If applicable, add screenshots to help explain your problem.

Additional context

This is a diff showing changes I made to the produced codebase in order to successfully execute the two referenced commands

diff --git a/node_modules/@phase2/outline-core/index.d.ts b/node_modules/@phase2/outline-core/index.d.ts
new file mode 100644
index 00000000..02903aec
--- /dev/null
+++ b/node_modules/@phase2/outline-core/index.d.ts
@@ -0,0 +1,8 @@
+/**
+ * Add the scopeId to each CSS rule selector.
+ * Handle the :host and ::slotted selectors.
+ */
+declare module '@phase2/outline-core/src/internal/light-dom.mjs' {
+  export function addScopeToStyles(cssStyles: any, scopeId: any): string;
+}
+//# sourceMappingURL=light-dom.d.mts.map
\ No newline at end of file
diff --git a/node_modules/@phase2/outline-core/src/controllers/light-dom-styles.ts b/node_modules/@phase2/outline-core/src/controllers/light-dom-styles.ts
index 3f229520..c0aa0993 100644
--- a/node_modules/@phase2/outline-core/src/controllers/light-dom-styles.ts
+++ b/node_modules/@phase2/outline-core/src/controllers/light-dom-styles.ts
@@ -1,6 +1,6 @@
 /* eslint-disable no-console */
 import { ReactiveControllerHost, CSSResultGroup, CSSResult } from 'lit';
-import { addScopeToStyles } from '../internal/light-dom';
+import { addScopeToStyles } from '@phase2/outline-core/src/internal/light-dom.mjs';

 /**
  * The LightComStyles ReactiveController.
diff --git a/rollup.config.mjs b/rollup.config.mjs
index 1698aab8..325c48ca 100644
--- a/rollup.config.mjs
+++ b/rollup.config.mjs
@@ -48,6 +48,7 @@ const defaultOutput = {
       'src/components/**/*.css.lit.ts',
       'src/components/**/*.test.ts',
       'src/components/examples/**/*',
+      'src/components/sample/**/*',
     ],
   },
   output: [
diff --git a/scripts/styles.mjs b/scripts/styles.mjs
index bd0a9600..09bf816b 100644
--- a/scripts/styles.mjs
+++ b/scripts/styles.mjs
@@ -6,7 +6,7 @@ import postcss from 'postcss';
 import fs from 'fs';
 import path from 'path';
 import glob from 'glob';
-import config from '@phase2/outline-config/postcss.config.js';
+import config from '@phase2/outline-config/postcss.config';
 import outline from '../outline.config.js';
 import { addScopeToStyles } from '@phase2/outline-core/src/internal/light-dom.mjs';

diff --git a/tsconfig.json b/tsconfig.json
index c0aa638e..63c9f053 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -42,6 +42,7 @@
   "exclude": [
     "./src/components/**/*.stories.ts",
     "./src/components/**/*.lit.ts",
+    "./src/components/sample/**/*.ts",
     "node_modules"
   ]
 }

[tekante]

#379 Addresses one of these changes though with a different fix. If that fix is correct then I believe that change would need to get ported to packages/outline-template/default/scripts/styles.mjs so that future projects use the correct reference.

[tekante]

#382 May partially address one of these changes though it does so by simply adding the mjs extension to the existing path based import. Determining how to generate the type declaration file is still to be done. Alternatively, manually adding it and changing the reference to a package based import.

[tekante]

https://github.com/phase2/outline/pull/385/files has annotations of changes and pointers to CI runs with the errors they fix (for ones I have CI runs for).