From 069a84d20f1c3297fb911abab6c020936fb489d6 Mon Sep 17 00:00:00 2001 From: Dominik Wilkowski Date: Fri, 13 Aug 2021 11:28:03 +1000 Subject: [PATCH 1/3] Added new RFC proposal --- RFCs/1-approved/remove-pancake.md | 21 +++++++++++++++++++++ 1 file changed, 21 insertions(+) create mode 100644 RFCs/1-approved/remove-pancake.md diff --git a/RFCs/1-approved/remove-pancake.md b/RFCs/1-approved/remove-pancake.md new file mode 100644 index 0000000..e1dfb5c --- /dev/null +++ b/RFCs/1-approved/remove-pancake.md @@ -0,0 +1,21 @@ +Status: `Proposal` +Implementer: + +# Remove pancake + +## The issue to be solved + +Pancake has been built (by me) a while ago and solved a couple very specific problems outlined in [this article](https://medium.com/dailyjs/npm-and-the-front-end-950c79fc22ce). +Since 2018 the front end space has evolved significantly and shipping CSS files via npm isn't an issue anymore. +In-fact shipping CSS files that are automatically imported by the prod bundle located inside a `node_modules/` folder causes significant issues to loaders like webpack which now require the CSS loader to be specified and the specifically allow the `node_modules/` path. + +## A short description of the solution + +We should remove pancake from the `postinstall` npm hook and deliver the CSS separately in the npm payload. +This means consumers can use the CSS file the way they like including via the `` HTML tag. + +## Technical details + +1. Remove the `postinstall` hook from each packages `package.json` +2. Remove the code that injects the imports automatically from [the helper](https://github.com/designsystemau/design-system-components/blob/master/scripts/helper.js#L432) +3. Document how to use the components and the CSS together From 3bd3d4b171beec9055b2ac7f3070a1dc5cbf993d Mon Sep 17 00:00:00 2001 From: Dominik Wilkowski Date: Fri, 13 Aug 2021 11:35:27 +1000 Subject: [PATCH 2/3] fixed up markdown --- RFCs/1-approved/remove-pancake.md | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/RFCs/1-approved/remove-pancake.md b/RFCs/1-approved/remove-pancake.md index e1dfb5c..e3cc661 100644 --- a/RFCs/1-approved/remove-pancake.md +++ b/RFCs/1-approved/remove-pancake.md @@ -1,5 +1,7 @@ -Status: `Proposal` -Implementer: +--- +Status: `Proposal` # Please do not change this. +Implementer: # It will be changed upon merging and as it moves through the RFC stages +--- # Remove pancake From fe05d194c6880766c66a13bfee4872809ed57864 Mon Sep 17 00:00:00 2001 From: Dominik Wilkowski Date: Tue, 14 Dec 2021 13:58:18 +1100 Subject: [PATCH 3/3] finished RFC --- RFC-by-stage/1-approved/remove-pancake.md | 24 +++++++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/RFC-by-stage/1-approved/remove-pancake.md b/RFC-by-stage/1-approved/remove-pancake.md index e3cc661..7737449 100644 --- a/RFC-by-stage/1-approved/remove-pancake.md +++ b/RFC-by-stage/1-approved/remove-pancake.md @@ -21,3 +21,27 @@ This means consumers can use the CSS file the way they like including via the `< 1. Remove the `postinstall` hook from each packages `package.json` 2. Remove the code that injects the imports automatically from [the helper](https://github.com/designsystemau/design-system-components/blob/master/scripts/helper.js#L432) 3. Document how to use the components and the CSS together + +The way you would have to use the components in react would then be: + +```js +import Button from '@gold.au/buttons'; + +import '@gold.au/buttons/styles.css'; + +function MyApp() { + return ; +} +``` + +This will require the [webpack CSS loader](https://webpack.js.org/loaders/css-loader/) in webpack while Parcel requires no config. + +The Sass files will then not be available anymore for integration as they currently feature lines like: + +```sass +@import '../../../core/src/sass/_module.scss'; +``` + +That path is only available within the monorepo. + +❗️ This means no more Sass exports.