Merge pull request #263 from brunolm/copy-files-public-build

Mortaro · web-flow · commit 6a61e6cdaa32 · 2023-05-23T14:31:20.000-03:00
Add example to copy files to public during build
diff --git a/i18n/en-US/components/Examples.yml b/i18n/en-US/components/Examples.yml
@@ -37,3 +37,5 @@ posts:
   - title: "Using Nullstack to build a personal Portfolio on GitHub"
     href: "/examples/using-nullstack-to-build-a-personal-portfolio-on-github"
     description: "Nullstack can be used to build a personal Portfolio on GitHub."
+  - title: "Copying static files to the public folder on build"
+    href: "/examples/copying-static-files-to-the-public-folder-on-build"
diff --git a/i18n/en-US/examples/copying-static-files-to-the-public-folder-on-build.md b/i18n/en-US/examples/copying-static-files-to-the-public-folder-on-build.md
@@ -0,0 +1,42 @@
+---
+title: "Copying static files to the public folder on build"
+description: "Copy static files to the public folder, like schema files, css, js and other files that comes with certain packages"
+---
+
+To copy static files to the public folder you need to create a custom webpack override.
+
+In order to modify the webpack config that comes in the Nullstack bundle, you can create a `webpack.config.js` as mentioned in the documentation ["How to customize Webpack"](/how-to-customize-webpack).
+
+```js
+// webpack.config.js
+const [server, client] = require("nullstack/webpack.config");
+
+const fse = require("fs-extra");
+
+class CopyFiles {
+  apply() {
+    fse.copySync("node_modules/swagger-ui-dist", "public/api-docs", {
+      overwrite: true,
+    });
+  }
+}
+
+function customServer(...args) {
+  const config = server(...args);
+  config.plugins.push(new CopyFiles());
+  return config;
+}
+
+module.exports = [customServer, client];
+```
+
+In case you need to serve these files, you can use `context.server` to create a route and `express.static` to point to the files you want to serve.
+
+```js
+// server.js
+context.server.use(
+  "/api-docs/",
+  express.static(path.join(__dirname, "..", "public/api-docs"))
+);
+// ...
+```
diff --git a/i18n/pt-BR/components/Examples.yml b/i18n/pt-BR/components/Examples.yml
@@ -19,3 +19,5 @@ posts:
   - title: "Using Nullstack to build a personal Portfolio on GitHub"
     href: "/examples/using-nullstack-to-build-a-personal-portfolio-on-github"
     description: "Nullstack can be used to build a personal Portfolio on GitHub."
+  - title: "Copiando arquivos estaticos para pasta public durante o build"
+    href: "/examples/copiando-arquivos-estaticos-para-pasta-public-durante-o-build"
diff --git a/i18n/pt-BR/examples/copiando-arquivos-estaticos-para-pasta-public-durante-o-build.md b/i18n/pt-BR/examples/copiando-arquivos-estaticos-para-pasta-public-durante-o-build.md
@@ -0,0 +1,42 @@
+---
+title: "Copiando arquivos estaticos para pasta public durante o build"
+description: "Copiando arquivos estaticos para pasta public, como arquivos de schema, css, js e outros arquivos que vem com certos pacotes"
+---
+
+To copy static files to the public folder you need to create a custom webpack override.
+
+In order to modify the webpack config that comes in the Nullstack bundle, you can create a `webpack.config.js` as mentioned in the documentation ["How to customize Webpack"](/how-to-customize-webpack).
+
+```js
+// webpack.config.js
+const [server, client] = require("nullstack/webpack.config");
+
+const fse = require("fs-extra");
+
+class CopyFiles {
+  apply() {
+    fse.copySync("node_modules/swagger-ui-dist", "public/api-docs", {
+      overwrite: true,
+    });
+  }
+}
+
+function customServer(...args) {
+  const config = server(...args);
+  config.plugins.push(new CopyFiles());
+  return config;
+}
+
+module.exports = [customServer, client];
+```
+
+In case you need to serve these files, you can use `context.server` to create a route and `express.static` to point to the files you want to serve.
+
+```js
+// server.js
+context.server.use(
+  "/api-docs/",
+  express.static(path.join(__dirname, "..", "public/api-docs"))
+);
+// ...
+```
