fix: build issues (#35)

* Set public path

* Remove peer deps from fix storybook package

* try parsing all css

* Add font loader to storybook webpack

* Add change

* build before lint

* Setup node berfore pnpm

* Revert setup order

* update test

* add change

.changeset/two-pears-teach.md

@@ -0,0 +1,8 @@
+---
+'bgdk': patch
+'@bgdk/storybook': patch
+'bgdk-basic-example': patch
+'create-bgdk': patch
+---
+
+fix: set public path in webpack config

.changeset/warm-trains-cry.md

@@ -0,0 +1,8 @@
+---
+'bgdk': patch
+'@bgdk/storybook': patch
+'bgdk-basic-example': patch
+'create-bgdk': patch
+---
+
+fix: storybook webpack config asset loading

.github/actions/setup-project/action.yml

@@ -5,7 +5,7 @@ runs:
   steps:
     - uses: pnpm/action-setup@v2.0.1
       with:
-        version: 6.23.6
+        version: '6.24.2'
 
     - uses: actions/setup-node@main
       with:

.github/workflows/test.yml

@@ -14,10 +14,10 @@ jobs:
 
       - uses: ./.github/actions/setup-project
 
-      - run: pnpm lint
-
       - run: pnpm build
 
+      - run: pnpm lint
+
       - uses: ./.github/actions/setup-verdaccio
 
       - name: Switch registries

package.json

@@ -10,7 +10,7 @@
   "author": "Eamon Hyland <ehyland90@gmail.com>",
   "license": "MIT",
   "private": true,
-  "packageManager": "pnpm@6.24.1",
+  "packageManager": "pnpm@6.24.2",
   "scripts": {
     "dev": "preconstruct dev",
     "test": "pnpm lint",

packages/bgdk/alias/mini-css-extract-plugin/package.json

@@ -0,0 +1,3 @@
+{
+  "main": "dist/bgdk-alias-mini-css-extract-plugin.cjs.js"
+}

packages/bgdk/alias/vanilla-extract-webpack-plugin/package.json

@@ -0,0 +1,3 @@
+{
+  "main": "dist/bgdk-alias-vanilla-extract-webpack-plugin.cjs.js"
+}

packages/bgdk/package.json

@@ -11,13 +11,15 @@
     "/examples/basic/.gitignore",
     "!/examples/*/yarn.yaml",
     "/templates/",
-    "/commands/"
+    "/commands/",
+    "/alias/"
   ],
   "preconstruct": {
     "entrypoints": [
       "cli/index.ts",
       "babel-preset/index.ts",
-      "commands/*.ts"
+      "commands/*.ts",
+      "alias/*.ts"
     ]
   },
   "entrypoints": [

packages/bgdk/src/alias/mini-css-extract-plugin.ts

@@ -0,0 +1 @@
+export { default } from 'mini-css-extract-plugin';

packages/bgdk/src/alias/vanilla-extract-webpack-plugin.ts

@@ -0,0 +1,2 @@
+export * from '@vanilla-extract/webpack-plugin';
+export { default } from '@vanilla-extract/webpack-plugin';

packages/bgdk/src/config/createWebpackConfig.ts

@@ -23,6 +23,7 @@ export function createWebpackConfig({
     output: {
       path: paths.dist,
       filename: dev ? '[name].js' : 'static/[name].[contenthash].js',
+      publicPath: '/',
       chunkFilename: dev
         ? '[name].chunk.js'
         : 'static/[name].chunk.[contenthash].js',

packages/storybook/package.json

@@ -29,24 +29,10 @@
     "url": "git@github.com:ehyland/bgdk.git",
     "directory": "packages/storybook"
   },
-  "peerDependencies": {
-    "@storybook/addon-actions": "^6.4.9",
-    "@storybook/addon-essentials": "^6.4.9",
-    "@storybook/addon-links": "^6.4.9",
-    "@storybook/builder-webpack5": "^6.4.9",
-    "@storybook/manager-webpack5": "^6.4.9",
-    "@storybook/react": "^6.4.9",
-    "@vanilla-extract/webpack-plugin": "*",
-    "mini-css-extract-plugin": "*"
-  },
   "devDependencies": {
-    "@storybook/addon-actions": "^6.4.9",
-    "@storybook/addon-essentials": "^6.4.9",
-    "@storybook/addon-links": "^6.4.9",
-    "@storybook/builder-webpack5": "^6.4.9",
-    "@storybook/manager-webpack5": "^6.4.9",
-    "@storybook/react": "^6.4.9",
-    "@vanilla-extract/webpack-plugin": "^2.1.4",
-    "mini-css-extract-plugin": "^2.4.5"
+    "bgdk": "^0.3.2"
+  },
+  "peerDependencies": {
+    "bgdk": "^0.3.2"
   }
 }

packages/storybook/src/fix-storybook-config.ts

@@ -1,5 +1,5 @@
-import MiniCssExtractPlugin from 'mini-css-extract-plugin';
-import { VanillaExtractPlugin } from '@vanilla-extract/webpack-plugin';
+import MiniCssExtractPlugin from 'bgdk/alias/mini-css-extract-plugin';
+import { VanillaExtractPlugin } from 'bgdk/alias/vanilla-extract-webpack-plugin';
 import type {
   Configuration,
   RuleSetRule,
@@ -15,15 +15,23 @@ const srcMatchers = [src, /\.css\.ts$/, /\.vanilla\.css$/];
 export function fixStorybookConfig(config: Configuration) {
   const rules = config.module?.rules as RuleSetRule[];
 
-  // exclude app code from default loaders
-  rules.forEach((rule: RuleSetRule) => {
-    const previousExclude = rule.exclude || [];
+  const fixRuleSet = (ruleSet: RuleSetRule[]) => {
+    ruleSet.forEach((rule) => {
+      if (Array.isArray(rule.oneOf)) {
+        fixRuleSet(rule.oneOf);
+      } else {
+        const previousExclude = rule.exclude || [];
+        rule.exclude = [
+          ...(Array.isArray(previousExclude)
+            ? previousExclude
+            : [previousExclude]), // Ensure we don't clobber any existing exclusions
+          ...srcMatchers,
+        ];
+      }
+    });
+  };
 
-    rule.exclude = [
-      ...(Array.isArray(previousExclude) ? previousExclude : [previousExclude]), // Ensure we don't clobber any existing exclusions
-      ...srcMatchers,
-    ];
-  });
+  fixRuleSet(rules);
 
   // add src loader for js
   rules.unshift({
@@ -35,7 +43,7 @@ export function fixStorybookConfig(config: Configuration) {
 
   // add src loader for css
   rules.unshift({
-    test: /\.vanilla\.css$/i,
+    test: /\.css$/i,
     use: [
       MiniCssExtractPlugin.loader,
       {
@@ -48,6 +56,13 @@ export function fixStorybookConfig(config: Configuration) {
     include: srcMatchers,
   });
 
+  // add asset loader
+  rules.unshift({
+    test: /\.(eot|svg|ttf|woff|woff2|png|jpg|gif)$/,
+    type: 'asset' as any,
+    include: srcMatchers,
+  });
+
   // add vanilla plugin
   config.plugins?.push(
     new VanillaExtractPlugin() as unknown as WebpackPluginInstance,