Global variables config initialization (#23)

* fix configurations

* fix generated .eslintcahce file in root folder facebook/create-react-app#10161

* Update code-style.yml

.github/workflows/code-style.yml

@@ -10,9 +10,12 @@ jobs:
       - uses: actions/setup-node@v3
         with:
           node-version: 16
+      - name: set npm version
+        run: npm install -g npm@8.3.1
       - name: Install npm dependencies
         run: npm ci
       - name: Eslint
         run: npm run eslint:ci
 #      - name: Stylelint
 #        run: npm run lint:css
+# styelelint is not working correctly

.husky/lint-staged.config.js

@@ -1,5 +1,5 @@
 module.exports = {
-  "*.{js,jsx,ts,tsx}": ["eslint --cache --fix"],
+  "*.{js,jsx,ts,tsx}": ["eslint --cache --fix --cache-location './node_modules/.cache/.eslintcache/'"],
   "src/**/*.{js,jsx,ts,tsx}": () =>
     "npx tsc --noEmit",
   "*.{md,json,scss,css}": "prettier --write",

.npmrc

@@ -0,0 +1 @@
+engine-strict=true

next.config.js

@@ -2,12 +2,12 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
 const externallyEmbeddableIFrameResponseHeaders =
   require("./src/shared-module/utils/responseHeaders").externallyEmbeddableIFrameResponseHeaders
+const svgoConfig = require("./src/shared-module/utils/svgoConfig")
 
 const config = {
   eslint: {
     ignoreDuringBuilds: true,
   },
-  output: "standalone",
   async headers() {
     return [
       {
@@ -22,6 +22,32 @@ const config = {
       },
     ]
   },
+  output: "standalone",
+  webpack(config) {
+    config.module.rules.push({
+      test: /\.svg$/i,
+      issuer: /\.[jt]sx?$/,
+      loader: "@svgr/webpack",
+      options: {
+        svgoConfig: svgoConfig,
+      },
+    })
+
+    return config
+  },
+  compiler: {
+    emotion: {
+      autoLabel: "always",
+      labelFormat: "[dirname]--[filename]--[local]",
+    },
+  },
+  experimental: {
+    modularizeImports: {
+      lodash: {
+        transform: "lodash/{{member}}",
+      },
+    },
+  },
 }
 
 if (process.env.NEXT_PUBLIC_BASE_PATH) {