@openedx/frontend-build 12.10.0-alpha.1

package/lib/scripts/serve.js

@@ -0,0 +1,78 @@
+const express = require('express');
+const path = require('path');
+const fs = require('fs');
+const chalk = require('chalk');
+const dotenv = require('dotenv');
+
+const resolvePrivateEnvConfig = require('../resolvePrivateEnvConfig');
+
+// Add process env vars. Currently used only for setting the
+// server port and the publicPath
+dotenv.config({
+  path: path.resolve(process.cwd(), '.env.development'),
+});
+
+// Allow private/local overrides of env vars from .env.development for config settings
+// that you'd like to persist locally during development, without the risk of checking
+// in temporary modifications to .env.development.
+resolvePrivateEnvConfig('.env.private');
+
+function isDirectoryEmpty(directoryPath) {
+  try {
+    const files = fs.readdirSync(directoryPath);
+    return files.length === 0;
+  } catch (error) {
+    if (error.code === 'ENOENT') {
+      // Directory does not exist, so treat it as empty.
+      return true;
+    }
+    throw error; // Throw the error for other cases
+  }
+}
+
+const buildPath = path.join(process.cwd(), 'dist');
+const buildPathIndex = path.join(buildPath, 'index.html');
+
+const fallbackPort = 8080;
+
+if (isDirectoryEmpty(buildPath)) {
+  const formattedBuildCmd = chalk.bold.redBright('``npm run build``');
+  console.log(chalk.bold.red(`ERROR: No build found. Please run ${formattedBuildCmd} first.`));
+} else {
+  let configuredPort;
+
+  try {
+    configuredPort = require(path.join(process.cwd(), 'env.config.js'))?.PORT;
+  } catch (error) {
+    // Pass. Consuming applications may not have an `env.config.js` file. This is OK.
+  }
+
+  if (!configuredPort) {
+    configuredPort = process.env.PORT;
+  }
+
+  // No `PORT` found in `env.config.js` and/or `.env.development|private`, so output a warning.
+  if (!configuredPort) {
+    const formattedEnvDev = chalk.bold.yellowBright('.env.development');
+    const formattedEnvConfig = chalk.bold.yellowBright('env.config.js');
+    const formattedPort = chalk.bold.yellowBright(fallbackPort);
+    console.log(chalk.yellow(`No port found in ${formattedEnvDev} and/or ${formattedEnvConfig} file(s). Falling back to port ${formattedPort}.\n`));
+  }
+
+  const app = express();
+
+  // Fallback to standard example port if no PORT config is set.
+  const PORT = configuredPort || fallbackPort;
+
+  app.use(express.static(buildPath));
+
+  app.use('*', (req, res) => {
+    res.sendFile(buildPathIndex);
+  });
+
+  app.listen(PORT, () => {
+    const formattedServedFile = chalk.bold.cyanBright(buildPathIndex);
+    const formattedPort = chalk.bold.cyanBright(PORT);
+    console.log(chalk.greenBright(`Serving ${formattedServedFile} on port ${formattedPort}...`));
+  });
+}

package/openedx.yaml

@@ -0,0 +1,10 @@
+# openedx.yaml
+
+---
+owner: edx/fedx-team
+tags:
+  - library
+  - build
+  - react
+  - webpack
+  - babel

package/package.json

@@ -0,0 +1,101 @@
+{
+  "name": "@openedx/frontend-build",
+  "version": "12.10.0-alpha.1",
+  "description": "Build tools, setup and config for frontend apps",
+  "publishConfig": {
+    "access": "public"
+  },
+  "main": "index.js",
+  "bin": {
+    "fedx-scripts": "./bin/fedx-scripts.js"
+  },
+  "scripts": {
+    "lint": "eslint . --no-eslintrc -c .eslintrc.js",
+    "test": "bash ./smoke-test.sh"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/openedx/frontend-build.git"
+  },
+  "keywords": [],
+  "author": "Open edX Community",
+  "license": "AGPL-3.0",
+  "bugs": {
+    "url": "https://github.com/openedx/frontend-build/issues"
+  },
+  "homepage": "https://github.com/openedx/frontend-build#readme",
+  "dependencies": {
+    "@babel/cli": "7.22.5",
+    "@babel/core": "7.22.5",
+    "@babel/eslint-parser": "7.22.9",
+    "@babel/plugin-proposal-class-properties": "7.18.6",
+    "@babel/plugin-proposal-object-rest-spread": "7.20.7",
+    "@babel/plugin-syntax-dynamic-import": "7.8.3",
+    "@babel/preset-env": "7.22.5",
+    "@babel/preset-react": "7.22.5",
+    "@edx/eslint-config": "4.0.0-alpha.1",
+    "@edx/new-relic-source-map-webpack-plugin": "2.1.0",
+    "@edx/typescript-config": "1.0.1",
+    "@formatjs/cli": "^6.0.3",
+    "@fullhuman/postcss-purgecss": "5.0.0",
+    "@pmmmwh/react-refresh-webpack-plugin": "0.5.11",
+    "@svgr/webpack": "8.1.0",
+    "@types/jest": "^26.0.0",
+    "@typescript-eslint/eslint-plugin": "^5.58.0",
+    "@typescript-eslint/parser": "^5.58.0",
+    "autoprefixer": "10.4.16",
+    "babel-jest": "27.5.1",
+    "babel-loader": "9.1.3",
+    "babel-plugin-formatjs": "^10.4.0",
+    "babel-plugin-transform-imports": "2.0.0",
+    "babel-polyfill": "6.26.0",
+    "chalk": "4.1.2",
+    "clean-webpack-plugin": "4.0.0",
+    "css-loader": "5.2.7",
+    "cssnano": "6.0.3",
+    "dotenv": "8.6.0",
+    "dotenv-webpack": "8.0.1",
+    "eslint": "8.44.0",
+    "eslint-config-airbnb": "19.0.4",
+    "eslint-config-airbnb-typescript": "^17.0.0",
+    "eslint-plugin-import": "2.27.5",
+    "eslint-plugin-jsx-a11y": "6.7.1",
+    "eslint-plugin-react": "7.32.2",
+    "eslint-plugin-react-hooks": "4.6.0",
+    "express": "4.18.2",
+    "file-loader": "6.2.0",
+    "html-webpack-plugin": "5.6.0",
+    "identity-obj-proxy": "3.0.0",
+    "image-minimizer-webpack-plugin": "3.8.3",
+    "jest": "26.6.3",
+    "mini-css-extract-plugin": "1.6.2",
+    "postcss": "8.4.33",
+    "postcss-custom-media": "10.0.2",
+    "postcss-loader": "7.3.4",
+    "postcss-rtlcss": "5.1.0",
+    "react-dev-utils": "12.0.1",
+    "react-refresh": "0.14.0",
+    "resolve-url-loader": "5.0.0",
+    "sass": "1.69.7",
+    "sass-loader": "13.3.3",
+    "sharp": "0.32.6",
+    "source-map-loader": "4.0.2",
+    "style-loader": "3.3.4",
+    "ts-jest": "26.5.0",
+    "typescript": "4.9.5",
+    "url-loader": "4.1.1",
+    "webpack": "5.89.0",
+    "webpack-bundle-analyzer": "4.10.1",
+    "webpack-cli": "5.1.4",
+    "webpack-dev-server": "4.15.1",
+    "webpack-merge": "5.10.0"
+  },
+  "devDependencies": {
+    "@babel/preset-typescript": "^7.18.6",
+    "@types/react": "^17.0.0",
+    "@types/react-dom": "^17.0.11"
+  },
+  "peerDependencies": {
+    "react": "^16.9.0 || ^17.0.0"
+  }
+}

package/renovate.json

@@ -0,0 +1,22 @@
+{
+  "extends": [
+    "config:base"
+  ],
+  "patch": {
+    "automerge": true
+  },
+  "rebaseStalePrs": true,
+  "packageRules": [
+    {
+      "packagePatterns": [
+        "eslint"
+      ],
+      "groupName": "eslint"
+    },
+    {
+      "matchPackagePatterns": ["@edx", "@openedx"],
+      "matchUpdateTypes": ["minor", "patch"],
+      "automerge": true
+    }
+  ]
+}

package/smoke-test.sh

@@ -0,0 +1,11 @@
+# exit on any errors in commands below
+# https://stackoverflow.com/questions/90418/exit-shell-script-based-on-process-exit-code
+set -e
+node ./bin/fedx-scripts jest --coverage plugins
+cd example
+npm install
+npm run lint
+npm run test
+npm run build
+npm run babel
+cd ../

package/tsconfig.json

@@ -0,0 +1,22 @@
+{
+  "extends": "@edx/typescript-config",
+  "compilerOptions": {
+    "rootDir": ".",
+    "outDir": "dist"
+  },
+  "include": [
+    ".eslintrc.js",
+    "config/.eslintrc.js",
+    "example/.eslintrc.js",
+    "example/**/*",
+    "lib",
+    "bin",
+    "config"
+  ],
+  "exclude": [
+    "node_modules",
+    "dist",
+    "example/dist/*",
+    "example/node_modules/*'"
+  ]
+}