Use typescript project references

Dockerfile

@@ -6,6 +6,7 @@ COPY package.json yarn.lock /app/
 RUN yarn install --frozen-lockfile
 
 COPY tslint.json /app
+COPY paths.js /app
 COPY client/ /app/client
 COPY common/ /app/common
 COPY server/ /app/server

Dockerfile.dev

@@ -5,6 +5,7 @@ WORKDIR /app/
 COPY package.json yarn.lock /app/
 RUN yarn install --frozen-lockfile
 
+COPY paths.js /app
 COPY tslint.json /app
 
 EXPOSE 8080

client/env.js

@@ -1,9 +1,6 @@
 const fs = require("fs");
 const path = require("path");
-const paths = require("./paths");
+const paths = require("../paths")
-
-// Make sure that including paths.js after env.js will read .env variables.
-delete require.cache[require.resolve("./paths")];
 
 const NODE_ENV = process.env.NODE_ENV;
 if (!NODE_ENV) {

client/tsconfig.json

@@ -25,5 +25,10 @@
                 "./client/*"
             ]
         }
+    },
+    "references": [
+        {
+            "path": "../common"
         }
+    ]
 }

client/webpack.config.js

@@ -11,8 +11,8 @@ const MiniCssExtractPlugin = require("mini-css-extract-plugin");
 const HappyPack = require("happypack");
 const ForkTsCheckerWebpackPlugin = require("fork-ts-checker-webpack-plugin");
 
-const {getClientEnvironment} = require("../common/env");
+const {getClientEnvironment} = require("./env");
-const paths = require("../common/paths");
+const paths = require("../paths");
 
 // Webpack uses `publicPath` to determine where the app is being served from.
 // It requires a trailing slash, or the file assets will get an incorrect path.
@@ -23,15 +23,9 @@ const publicPath = paths.publicPath;
 const publicUrl = paths.publicUrl.slice(0, -1);
 // Source maps are resource heavy and can cause out of memory issue for large source files.
 const shouldUseSourceMap = process.env.GENERATE_SOURCEMAP !== 'false';
-// Some apps do not use client-side routing with pushState.
-// For these, "homepage" can be set to "." to enable relative asset paths.
-const shouldUseRelativeAssetPaths = publicPath === "./";
 // Get environment variables to inject into our app.
 const environ = getClientEnvironment(publicUrl);
 
-// Note: defined here because it will be used more than once.
-const cssFilename = "static/css/[name].[contenthash:8].css";
-
 const postCssConfig = {
     loader: require.resolve("postcss-loader"),
     options: {

common/sprinklersRpc/schema/requests.ts

@@ -1,5 +1,6 @@
 import { createSimpleSchema, deserialize, ModelSchema, primitive, serialize } from "serializr";
-import * as requests from "../deviceRequests";
+
+import * as requests from "@common/sprinklersRpc/deviceRequests";
 import * as common from "./common";
 
 export const withType: ModelSchema<requests.WithType> = createSimpleSchema({

common/sprinklersRpc/websocketData.ts

@@ -1,6 +1,5 @@
-import * as rpc from "../jsonRpc/index";
-
 import { IUser } from "@common/httpApi";
+import * as rpc from "@common/jsonRpc/index";
 import { Response as ResponseData } from "@common/sprinklersRpc/deviceRequests";
 
 export interface IAuthenticateRequest {

common/tsconfig.json

@@ -1,5 +1,6 @@
 {
     "compilerOptions": {
+        "outDir": "../dist/common",
         "experimentalDecorators": true,
         "target": "es2017",
         "lib": [
@@ -10,15 +11,14 @@
         ],
         "module": "commonjs",
         "strict": true,
-        "allowJs": true,
         "baseUrl": "..",
+        "composite": true,
+        "declaration": true,
         "sourceMap": true,
+        "declarationMap": true,
         "paths": {
             "@common/*": [
                 "./common/*"
-            ],
-            "@client/*": [
-                "./client/*"
             ]
         }
     },

package.json

@@ -3,19 +3,19 @@
   "version": "1.0.0",
   "private": true,
   "description": "A frontend for mqtt based IoT sprinklers systems",
-  "main": "dist/server/index.js",
+  "main": "dist/index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
     "clean": "rm -rf ./dist ./build ./public",
     "build:client": "NODE_ENV=production webpack --config ./client/webpack.config.js --env prod",
-    "build:server": "tsc --project server",
+    "build:server": "tsc --build server",
     "build": "run-p build:*",
     "watch:client": "yarn build:client --watch",
     "watch:server": "yarn build:server --watch",
     "start:dev-server": "NODE_ENV=development webpack-dev-server --config ./client/webpack.config.js --env dev",
     "start": "NODE_ENV=development node .",
-    "start:pretty": "yarn start | node dist/server/logging/prettyPrint.js",
+    "start:pretty": "yarn start | node dist/logging/prettyPrint.js",
-    "start:nodemon": "nodemon --delay 0.5 --exec \"env NODE_ENV=development node . | node dist/server/logging/prettyPrint.js\"",
+    "start:nodemon": "nodemon --delay 0.5 --exec \"env NODE_ENV=development node . | node dist/logging/prettyPrint.js\"",
     "start:watch": "run-p watch:server start:nodemon",
     "start:dev": "run-p start:dev-server start:watch",
     "lint:client": "tslint --project client --force --format verbose",

paths.js

@@ -1,5 +1,5 @@
-const path = require("path");
 const fs = require("fs");
+const path = require("path");
 const url = require("url");
 
 exports.rootDir = fs.realpathSync(process.cwd());
@@ -8,7 +8,7 @@ const resolveRoot = exports.resolveRoot = (p) => path.resolve(exports.rootDir, p
 function ensureSlash(p, needsSlash) {
     const hasSlash = p.endsWith("/");
     if (hasSlash && !needsSlash) {
-        return p.substr(p, p.length - 1);
+        return p.substr(0, p.length - 1);
     } else if (!hasSlash && needsSlash) {
         return `${p}/`;
     } else {

server/Database.ts

@@ -1,7 +1,7 @@
 import * as path from "path";
 import { Connection, createConnection, EntityManager, getConnectionOptions, Repository } from "typeorm";
 
-import logger from "../common/logger";
+import logger from "@common/logger";
 
 import { SprinklersDevice, User } from "./entities";
 import { SprinklersDeviceRepository, UserRepository } from "./repositories/";

server/configureAlias.ts

@@ -1,4 +1,5 @@
 import * as moduleAlias from "module-alias";
 import * as path from "path";
-moduleAlias.addAlias("@common", path.resolve(__dirname, "..", "common"));
+moduleAlias.addAlias("@common", path.resolve(__dirname, "common"));
 moduleAlias.addAlias("@server", __dirname);
+moduleAlias.addAlias("paths", path.resolve(__dirname, "..", "paths"));

server/env.ts

@@ -0,0 +1,24 @@
+import * as fs from "fs";
+
+// tslint:disable-next-line:no-var-requires
+const paths = require("paths");
+
+const NODE_ENV = process.env.NODE_ENV || "development";
+
+const dotenvFiles: string[] = [
+  `${paths.dotenv}.${NODE_ENV}.local`,
+  `${paths.dotenv}.${NODE_ENV}`,
+  // Don"t include `.env.local` for `test` environment
+  // since normally you expect tests to produce the same
+  // results for everyone
+  NODE_ENV !== "test" && `${paths.dotenv}.local`,
+  paths.dotenv,
+].filter(Boolean) as string[];
+
+dotenvFiles.forEach((dotenvFile) => {
+  if (fs.existsSync(dotenvFile)) {
+    require("dotenv").config({
+      path: dotenvFile,
+    });
+  }
+});

server/express/index.ts

@@ -1,7 +1,7 @@
 import * as bodyParser from "body-parser";
 import * as express from "express";
 
-import { ServerState } from "../state";
+import { ServerState } from "@server/state";
 import createApi from "./api";
 import errorHandler from "./errorHandler";
 import requestLogger from "./requestLogger";

server/express/serveApp.ts

@@ -2,7 +2,8 @@ import { Express } from "express";
 import * as path from "path";
 import * as serveStatic from "serve-static";
 
-import * as paths from "@common/paths";
+// tslint:disable-next-line:no-var-requires
+const paths = require("paths");
 
 const index = path.join(paths.publicDir, "index.html");
 

server/index.ts

@@ -1,7 +1,7 @@
 /* tslint:disable:ordered-imports */
 import "reflect-metadata";
 import "./configureAlias";
-import "@common/env";
+import "./env";
 import "./configureLogger";
 
 import log from "@common/logger";

server/repositories/SprinklersDeviceRepository.ts

@@ -1,6 +1,6 @@
 import { EntityRepository, Repository } from "typeorm";
 
-import { SprinklersDevice, User } from "../entities";
+import { SprinklersDevice, User } from "@server/entities";
 
 @EntityRepository(SprinklersDevice)
 export class SprinklersDeviceRepository extends Repository<SprinklersDevice> {

server/repositories/UserRepository.ts

@@ -1,6 +1,6 @@
 import { EntityRepository, FindOneOptions, Repository } from "typeorm";
 
-import { User } from "../entities";
+import { User } from "@server/entities";
 
 export interface FindUserOptions {
     devices: boolean;

server/tsconfig.json

@@ -26,6 +26,11 @@
       ]
     }
   },
+  "references": [
+    {
+      "path": "../common"
+    }
+  ],
   "include": [
     "./**/*.ts"
   ]