fix: use preval macro for preloading static file on build

commercetools · Apr 25, 2022 · dc15710 · dc15710
1 parent 897db9f
commit dc15710
Show file tree

Hide file tree

Showing 6 changed files with 26 additions and 14 deletions.
diff --git a/packages/mc-html-template/package.json b/packages/mc-html-template/package.json
@@ -15,16 +15,7 @@
     "access": "public"
   },
   "main": "./build/index.js",
-  "files": [
-    "build",
-    "html-docs",
-    "html-scripts",
-    "html-styles",
-    "webpack.js",
-    "package.json",
-    "LICENSE",
-    "README.md"
-  ],
+  "files": ["build", "webpack.js", "package.json", "LICENSE", "README.md"],
   "scripts": {
     "build": "rimraf build && babel src --out-dir build",
     "build:bundles:watch": "yarn build -w"
@@ -42,6 +33,7 @@
   "devDependencies": {
     "@babel/plugin-transform-runtime": "^7.17.0",
     "@babel/preset-env": "^7.16.11",
+    "babel-plugin-preval": "^5.1.0",
     "rimraf": "3.0.2"
   },
   "engines": {
@@ -62,6 +54,7 @@
       ]
     ],
     "plugins": [
+      "preval",
       [
         "@babel/plugin-transform-runtime",
         {

diff --git a/packages/mc-html-template/src/load-html-docs.js b/packages/mc-html-template/src/load-html-docs.js
@@ -1,4 +1,10 @@
-/* eslint-disable no-console */
+// @preval
+/**
+ * https://github.com/kentcdodds/babel-plugin-preval#preval-file-comment--preval
+ * NOTE: This file is pre-evaluated during build time, using `babel-plugin-preval`.
+ * This is ok as the loaded files are static anyway and it prevents possible
+ * loading issues when files are required through Webpack own context.
+ */
 const fs = require('fs');
 const path = require('path');
 

diff --git a/packages/mc-html-template/src/load-html-scripts.js b/packages/mc-html-template/src/load-html-scripts.js
@@ -1,4 +1,10 @@
-/* eslint-disable no-console */
+// @preval
+/**
+ * https://github.com/kentcdodds/babel-plugin-preval#preval-file-comment--preval
+ * NOTE: This file is pre-evaluated during build time, using `babel-plugin-preval`.
+ * This is ok as the loaded files are static anyway and it prevents possible
+ * loading issues when files are required through Webpack own context.
+ */
 const fs = require('fs');
 const path = require('path');
 const uglify = require('uglify-js');

diff --git a/packages/mc-html-template/src/load-html-styles.js b/packages/mc-html-template/src/load-html-styles.js
@@ -1,4 +1,10 @@
-/* eslint-disable no-console */
+// @preval
+/**
+ * https://github.com/kentcdodds/babel-plugin-preval#preval-file-comment--preval
+ * NOTE: This file is pre-evaluated during build time, using `babel-plugin-preval`.
+ * This is ok as the loaded files are static anyway and it prevents possible
+ * loading issues when files are required through Webpack own context.
+ */
 const fs = require('fs');
 const path = require('path');
 const uglifycss = require('uglifycss');

diff --git a/playground/src/components/state-machines-list/state-machines-list.jsx b/playground/src/components/state-machines-list/state-machines-list.jsx
@@ -21,7 +21,7 @@ import {
 import { Pagination } from '@commercetools-uikit/pagination';
 import { ContentNotification } from '@commercetools-uikit/notifications';
 import messages from './messages';
-import styles from './state-machines-list.mod.css';
+import styles from './state-machines-list.module.css';
 import FetchStatesQuery from './fetch-states.ctp.graphql';
 import { getErrorMessage } from '../../utils/get-error-message';
 

diff --git a/yarn.lock b/yarn.lock
@@ -2973,6 +2973,7 @@ __metadata:
     "@babel/runtime-corejs3": ^7.17.9
     "@commercetools-frontend/application-config": 21.3.4
     "@commercetools-frontend/constants": 21.3.4
+    babel-plugin-preval: ^5.1.0
     core-js: ^3.21.1
     rimraf: 3.0.2
     serialize-javascript: 6.0.0