fix: clean up dist folder setup

ccontrols · Mar 14, 2021 · 7d16d98 · 7d16d98
1 parent e9780bb
commit 7d16d98
Show file tree

Hide file tree

Showing 8 changed files with 25 additions and 15 deletions.
diff --git a/core/core/src/node-utils.ts b/core/core/src/node-utils.ts
@@ -22,8 +22,10 @@ export const findUpFile = (
 export const defaultDistFolder = 'dist';
 
 export const getDistName = (options: BuildProps): string => {
-  const dist =
-    options.distFolder || path.join(process.cwd(), defaultDistFolder);
+  const dist = path.join(
+    process.cwd(),
+    options.distFolder || defaultDistFolder,
+  );
   return dist;
 };
 

diff --git a/examples/react-webpack-5/webpack.dev.config.ts b/examples/react-webpack-5/webpack.dev.config.ts
@@ -59,5 +59,5 @@ const config: webpack.Configuration & {
 
 export default withComponentControls({
   config,
-  options: { configPath: '.config', distFolder: publicPath },
+  options: { configPath: '.config', distFolder: publicFolder },
 });
diff --git a/examples/react-webpack-5/webpack.prod.config.ts b/examples/react-webpack-5/webpack.prod.config.ts
@@ -8,7 +8,6 @@ const CopyPlugin = require('copy-webpack-plugin');
 import { withComponentControls } from '@component-controls/react-router-integration/webpack-build';
 
 const publicFolder = process.env.PUBLIC_PATH || 'public';
-const publicPath = path.join(__dirname, publicFolder);
 const distFolder = process.env.BUILD_PATH || 'build';
 const distPath = path.join(__dirname, distFolder);
 
@@ -65,5 +64,5 @@ const config: webpack.Configuration = {
 
 export default withComponentControls({
   config,
-  options: { configPath: '.config', distFolder: publicPath },
+  options: { configPath: '.config', distFolder: publicFolder },
 });
diff --git a/examples/react-webpack/webpack.dev.config.js b/examples/react-webpack/webpack.dev.config.js
@@ -57,6 +57,6 @@ module.exports = withComponentControls({
   config,
   options: {
     configPath: '.config',
-    distFolder: publicPath,
+    distFolder: publicFolder,
   },
 });
diff --git a/examples/react-webpack/webpack.prod.config.js b/examples/react-webpack/webpack.prod.config.js
@@ -9,7 +9,6 @@ const {
 } = require('@component-controls/react-router-integration/webpack-build');
 
 const publicFolder = process.env.PUBLIC_PATH || 'public';
-const publicPath = path.join(__dirname, publicFolder);
 const distFolder = process.env.BUILD_PATH || 'build';
 const distPath = path.join(__dirname, distFolder);
 
@@ -66,5 +65,5 @@ const config = {
 
 module.exports = withComponentControls({
   config,
-  options: { configPath: '.config', distFolder: publicPath },
+  options: { configPath: '.config', distFolder: publicFolder },
 });
diff --git a/examples/stories/src/tutorial/getting-started/ssg/webpack.mdx b/examples/stories/src/tutorial/getting-started/ssg/webpack.mdx
@@ -62,7 +62,7 @@ const config = {
 // the following will compile your documentation files before launching the webpack proces to compile the documentation site itself:
 module.exports = withComponentControls({
   config,
-  options: { configPath: '.config', distFolder: publicPath },
+  options: { configPath: '.config', distFolder: publicFolder },
 });
 ```
 
@@ -86,7 +86,7 @@ module.exports = withComponentControls({
   config,
   options: {
     configPath: '.config',
-    distFolder: publicPath,
+    distFolder: publicFolder,
   },
 });
 ```

diff --git a/integrations/base-integration/src/webpack-build.ts b/integrations/base-integration/src/webpack-build.ts
@@ -57,8 +57,7 @@ const createOptions = (buildOptions?: BuildProps): BuildProps => {
     return acc;
   }, {});
 
-  const distFolder =
-    options.distFolder || path.join(process.cwd(), defaultDistFolder);
+  const distFolder = options.distFolder || defaultDistFolder;
   const staticFolder = path.join(options.distFolder || distFolder, 'static');
   return mergeConfig<BuildProps>(
     mergeConfig(defaultCompileProps, {
@@ -100,7 +99,10 @@ export const webpackConfig = ({
   options?: BuildProps;
 }): any => {
   const buildOptions = createOptions(options);
-  const bundleFilePath = getBundleName(buildOptions);
+  const bundleFilePath = path.resolve(
+    process.cwd(),
+    getBundleName(buildOptions),
+  );
   return {
     ...config,
     resolve: {

diff --git a/integrations/nextjs-plugin/src/build.ts b/integrations/nextjs-plugin/src/build.ts
@@ -1,6 +1,10 @@
 import fs from 'fs';
+import path from 'path';
 import { BuildProps, RuleOptions } from '@component-controls/core';
-import { getCSSBundleName } from '@component-controls/core/node-utils';
+import {
+  getCSSBundleName,
+  defaultDistFolder,
+} from '@component-controls/core/node-utils';
 import {
   buildBundle,
   webpackConfig,
@@ -11,7 +15,7 @@ module.exports = ({
   configPath,
   presets,
   staticFolder,
-  distFolder,
+  distFolder = defaultDistFolder,
   webpack,
   ...rest
 }: BuildProps) => () => {
@@ -26,6 +30,7 @@ module.exports = ({
   return {
     /**
      * we need some async function, to make sure the compilation process is completed
+     * headers is the first called from async redirects() amd async rewrites()
      */
     async headers() {
       await buildBundle({
@@ -44,6 +49,9 @@ module.exports = ({
       const loader: any = config.module?.rules?.find(
         (r: any) => (r?.use as any)?.loader === 'next-babel-loader',
       );
+      if (loader) {
+        loader.exclude = [path.join(process.cwd(), distFolder)];
+      }
       if (loader?.options) {
         (loader.options as any).babelPresetPlugins.push(
           '@emotion/babel-plugin',