Skip to content

Commit

Permalink
Export compiled CSS in package.json (#1490)
Browse files Browse the repository at this point in the history
## Summary:

Recently we changed some of our packages to use the modern syntax for declaring packge exports: namely the `exports` key. When a package defines this key, it no longer allows arbitrary relative exports (ie. `import X from '@khanacademy/perseus/dist/some-file.js';`). 

This: 

<img width="568" alt="image" src="https://github.com/user-attachments/assets/8ee2898e-00ff-49a0-a690-93c71e359897">

Becomes: 

<img width="482" alt="image" src="https://github.com/user-attachments/assets/9127d53c-52ad-4b1d-ba11-bcd45af585b4">


As a result, our bundled CSS was no longer exported. In webapp today, we need to import the bundled CSS using a fully-relative path (ie. `import '../../node_modules/@khanacademy/perseus/dist/index.css''`). This is clunky and the import paths are not portable. 

So, this PR fixes it by exporting all CSS files from our bundles.

Issue: "none"

## Test plan:

Update webapp with the snapshot npm package and then check if we can change our CSS imports to `import '@khanacademy/perseus/index.css';`

Author: jeremywiebe

Reviewers: jeresig, jeremywiebe, #perseus

Required Reviewers:

Approved By: jeresig

Checks: ✅ codecov/project, ✅ codecov/patch, ✅ Upload Coverage (ubuntu-latest, 20.x), ✅ Publish npm snapshot (ubuntu-latest, 20.x), ✅ Check builds for changes in size (ubuntu-latest, 20.x), ✅ Cypress (ubuntu-latest, 20.x), ✅ Jest Coverage (ubuntu-latest, 20.x), ✅ Lint, Typecheck, Format, and Test (ubuntu-latest, 20.x), ✅ Check for .changeset entries for all changed files (ubuntu-latest, 20.x), ✅ Publish Storybook to Chromatic (ubuntu-latest, 20.x), ✅ gerald

Pull Request URL: #1490
  • Loading branch information
jeremywiebe authored Aug 13, 2024
1 parent 10909ff commit c2464ee
Show file tree
Hide file tree
Showing 4 changed files with 20 additions and 2 deletions.
7 changes: 7 additions & 0 deletions .changeset/nine-ducks-enjoy.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
"@khanacademy/math-input": patch
"@khanacademy/perseus": patch
"@khanacademy/perseus-editor": patch
---

Explicitly export bundled css in package.json
3 changes: 2 additions & 1 deletion packages/math-input/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,8 @@
"require": "./dist/strings.js",
"types": "./dist/strings.d.ts",
"source": "./src/strings.ts"
}
},
"./styles.css": "./dist/index.css"
},
"files": [
"dist"
Expand Down
9 changes: 9 additions & 0 deletions packages/perseus-editor/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,15 @@
"module": "dist/es/index.js",
"main": "dist/index.js",
"source": "src/index.ts",
"exports": {
".": {
"import": "./dist/es/index.js",
"require": "./dist/index.js",
"types": "./dist/index.d.ts",
"source": "./src/index.ts"
},
"./styles.css": "./dist/index.css"
},
"files": [
"dist"
],
Expand Down
3 changes: 2 additions & 1 deletion packages/perseus/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,8 @@
"require": "./dist/strings.js",
"types": "./dist/strings.d.ts",
"source": "./src/strings.ts"
}
},
"./styles.css": "./dist/index.css"
},
"files": [
"dist"
Expand Down

0 comments on commit c2464ee

Please sign in to comment.