npm nx-cra

apps/vega-explorer/craco.config.js

@@ -0,0 +1,40 @@
+
+  const path = require('path');
+  const TsConfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
+  const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');
+  module.exports = {
+    webpack: {
+      configure: (config) => {
+        // Remove guard against importing modules outside of `src`.
+        // Needed for workspace projects.
+        config.resolve.plugins = config.resolve.plugins.filter(
+          (plugin) => !(plugin instanceof ModuleScopePlugin)
+        );
+        // Add support for importing workspace projects.
+        config.resolve.plugins.push(
+          new TsConfigPathsPlugin({
+            configFile: path.resolve(__dirname, 'tsconfig.json'),
+            extensions: ['.ts', '.tsx', '.js', '.jsx'],
+            mainFields: ['module', 'main'],
+          })
+        );
+        
+        // Replace include option for babel loader with exclude
+        // so babel will handle workspace projects as well.
+        config.module.rules[1].oneOf.forEach((r) => {
+          if (r.loader && r.loader.indexOf('babel') !== -1) {
+            r.exclude = /node_modules/;
+            delete r.include;
+          }
+        });
+        return config;
+      },
+    },
+    jest: {
+      configure: (config) => {
+        config.resolver = '@nrwl/jest/plugins/resolver';
+        return config;
+      },
+    },
+  };
+  

apps/vega-explorer/package.json

@@ -1,7 +1,6 @@
 {
   "name": "vega-explorer",
   "version": "0.1.0",
-  "private": true,
   "dependencies": {
     "@apollo/client": "^3.5.8",
     "@testing-library/jest-dom": "^5.16.2",
@@ -22,11 +21,12 @@
     "web-vitals": "^2.1.4"
   },
   "scripts": {
-    "start": "react-scripts start",
-    "build": "react-scripts build",
-    "test": "react-scripts test",
+    "start": "craco start",
+    "build": "BUILD_PATH=../../dist/apps/vega-explorer craco build",
+    "test": "craco test",
     "eject": "react-scripts eject",
-    "generate": "env-cmd yarn apollo codegen:generate --target=typescript --globalTypesFile=src/__generated__/globalTypes.ts"
+    "generate": "env-cmd yarn apollo codegen:generate --target=typescript --globalTypesFile=src/__generated__/globalTypes.ts",
+    "serve": "npm start"
   },
   "eslintConfig": {
     "extends": [
@@ -54,4 +54,4 @@
   "resolutions": {
     "graphql": "15.8.0"
   }
-}
+}

apps/vega-explorer/project.json

@@ -0,0 +1,6 @@
+{
+  "root": "apps/vega-explorer",
+  "sourceRoot": "apps/vega-explorer/src",
+  "projectType": "application",
+  "tags": []
+}

apps/vega-explorer/tsconfig.app.json

@@ -0,0 +1,23 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "types": [
+      "node"
+    ]
+  },
+  "files": [
+    "../../node_modules/@nrwl/react/typings/cssmodule.d.ts",
+    "../../node_modules/@nrwl/react/typings/image.d.ts"
+  ],
+  "exclude": [
+    "**/*.spec.ts",
+    "**/*.spec.tsx"
+  ],
+  "include": [
+    "**/*.js",
+    "**/*.jsx",
+    "**/*.ts",
+    "**/*.tsx"
+  ]
+}

apps/vega-explorer/tsconfig.json

@@ -18,9 +18,10 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,
-    "jsx": "react-jsx"
+    "jsx": "react"
   },
   "include": [
     "src"
-  ]
-}
+  ],
+  "extends": "../../tsconfig.base.json"
+}

apps/vega-explorer/tsconfig.spec.json

@@ -0,0 +1,22 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "module": "commonjs",
+    "types": [
+      "jest",
+      "node"
+    ]
+  },
+  "include": [
+    "**/*.spec.ts",
+    "**/*.spec.tsx",
+    "**/*.spec.js",
+    "**/*.spec.jsx",
+    "**/*.d.ts"
+  ],
+  "files": [
+    "../../node_modules/@nrwl/react/typings/cssmodule.d.ts",
+    "../../node_modules/@nrwl/react/typings/image.d.ts"
+  ]
+}