feat!: compile to JS before publishing

.github/workflows/ci.yml

@@ -25,6 +25,8 @@ jobs:
       run: npm run lint
     - name: Test
       run: npm run test
+    - name: Build
+      run: npm run build
     - name: i18n_extract
       run: npm run i18n_extract
     - name: Coverage

Makefile

@@ -40,3 +40,15 @@ pull_translations:
 
 	$(intl_imports) frontend-base paragon frontend-component-header frontend-component-footer frontend-app-instruct
 
+clean:
+	rm -rf dist
+
+build: clean
+	tsc --project tsconfig.build.json
+	tsc-alias -p tsconfig.build.json
+	find src -type f -name '*.scss' -exec sh -c '\
+	  for f in "$$@"; do \
+	    d="dist/$${f#src/}"; \
+	    mkdir -p "$$(dirname "$$d")"; \
+	    cp "$$f" "$$d"; \
+	  done' sh {} +

babel.config.js

@@ -1,3 +1,3 @@
-const { createConfig } = require('@openedx/frontend-base/config');
+const { createConfig } = require('@openedx/frontend-base/tools');
 
 module.exports = createConfig('babel');

eslint.config.js

@@ -1,6 +1,6 @@
 // @ts-check
 
-const { createLintConfig } = require('@openedx/frontend-base/config');
+const { createLintConfig } = require('@openedx/frontend-base/tools');
 
 module.exports = createLintConfig(
   {

jest.config.js

@@ -1,4 +1,4 @@
-const { createConfig } = require('@openedx/frontend-base/config');
+const { createConfig } = require('@openedx/frontend-base/tools');
 
 module.exports = createConfig('test', {
   setupFilesAfterEnv: [

package.json

@@ -6,9 +6,12 @@
     "type": "git",
     "url": "git+https://github.com/openedx/frontend-app-instruct.git"
   },
-  "main": "src/index.ts",
+  "exports": {
+    ".": "./dist/index.js",
+    "./app.scss": "./dist/app.scss"
+  },
   "files": [
-    "/src"
+    "/dist"
   ],
   "browserslist": [
     "extends @edx/browserslist-config"
@@ -18,10 +21,13 @@
     "*.scss"
   ],
   "scripts": {
+    "build": "make build",
+    "clean": "make clean",
     "dev": "PORT=8080 PUBLIC_PATH=/instructor openedx dev",
     "i18n_extract": "openedx formatjs extract",
     "lint": "openedx lint .",
     "lint:fix": "openedx lint --fix .",
+    "prepack": "npm run build",
     "snapshot": "openedx test --updateSnapshot",
     "test": "openedx test --coverage --passWithNoTests"
   },
@@ -47,10 +53,11 @@
     "@types/jest": "^30.0.0",
     "@types/react": "^18",
     "@types/react-dom": "^18",
-    "jest": "^29"
+    "jest": "^29",
+    "tsc-alias": "^1.8.16"
   },
   "peerDependencies": {
-    "@openedx/frontend-base": "^1.0.0-alpha.11",
+    "@openedx/frontend-base": "^1.0.0-alpha.13",
     "@openedx/paragon": "^23",
     "@tanstack/react-query": "^5",
     "react": "^18",

site.config.dev.tsx

@@ -2,7 +2,7 @@ import { EnvironmentTypes, SiteConfig, footerApp, headerApp, shellApp } from '@o
 
 import { instructApp } from './src';
 
-import './src/main.scss';
+import './src/app.scss';
 
 const siteConfig: SiteConfig = {
   siteId: 'instructor-dev',

src/Main.tsx

@@ -5,7 +5,7 @@ import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
 import { AlertProvider } from './providers/AlertProvider';
 import { appId } from './constants';
 
-import './main.scss';
+import './app.scss';
 
 const queryClient = new QueryClient();
 

tsconfig.build.json

@@ -0,0 +1,19 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "rootDir": "src",
+    "outDir": "dist",
+    "noEmit": false
+  },
+  "include": [
+    "src/**/*"
+  ],
+  "exclude": [
+    "src/**/*.test.ts",
+    "src/**/*.test.tsx",
+    "src/**/*.spec.ts",
+    "src/**/*.spec.tsx",
+    "src/__mocks__/**/*",
+    "src/setupTest.js"
+  ]
+}

tsconfig.json

@@ -1,11 +1,11 @@
 {
-  "extends": "@openedx/frontend-base/config/tsconfig.json",
+  "extends": "@openedx/frontend-base/tools/tsconfig.json",
   "compilerOptions": {
     "rootDir": ".",
     "outDir": "dist",
     "paths": {
-        "@src/*": ["./src/*"]
-      } 
+      "@src/*": ["./src/*"]
+    }
   },
   "include": [
     "src/**/*",