Skip to content

Commit

Permalink
Merge branch 'develop'
Browse files Browse the repository at this point in the history
  • Loading branch information
gnithin committed Mar 6, 2019
2 parents 90e57fd + 7e4eb1b commit 8ac1461
Show file tree
Hide file tree
Showing 13 changed files with 334 additions and 147 deletions.
4 changes: 4 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,9 @@
# CHANGE-LOG

## 0.3.0
- Add `getFlavor` macro
- Fix the unmet dependency warnings on installing the library

## 0.2.1
- Update readme
- Update description key in package.json
Expand Down
32 changes: 30 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,8 @@ $ yarn add flavors.macro
```

## Usage

### Flavors
A placholder for a flavor, called a flavor-key, needs to be configured. This key can be used in the import statements in the app. Against this key, flavors can be added.

Add the following into the `.babel-plugin-macrosrc.json` at the root of the project.
Expand All @@ -42,7 +44,7 @@ You can then use the flavor-key in any class by adding the macro-key as the last
```js
import flavors from 'flavors.macro'
import Hello from './hello.layout-theme.js'
import Bye from './hello.layout-theme'
import Bye from './bye.layout-theme'
// ... other imports

// Add this right after all the imports are declared
Expand All @@ -52,13 +54,39 @@ When the application is built, the above class will evaluate to -

```js
import Hello from './hello.green.js'
import Bye from './hello.green'
import Bye from './bye.green'
// ... other imports
```

NOTE: After adding/editing the configuration file(`.babel-plugin-macrosrc.json` or if any of the other equivalents being used), the npm server needs to be manually restarted.

Multiple flavor-keys can be added to the `flavorsMap`. If there are no flavor-keys, then a default key `defaultFlavor` is assumed, which will be replaced by an empty string.

### getFlavor
If the difference between flavors is really small/subtle or if there is already existing code, in which the flavors need to be created for a small portion of it, creating separate files for all of the different flavors can be cumbersome.

The `getFlavor()` macro call-expression can be used to fetch the flavor for the corresponding flavor-key.

So for the configuration from the above examples -
```js
import { getFlavor } from 'flavors.macro'

// ... Rest of the code
var currFlavor = getFlavor("layout-theme")
switch (currFlavor) {
case "green":
console.log("Using green flavor")
break;
case "red":
console.log("Using red flavor")
break;
case "":
default:
console.log("No such flavor found")
}
```
`getFlavor` will return an empty string if the flavor-key is incorrect.


## License
MIT. See license file
2 changes: 1 addition & 1 deletion example-app/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -31,4 +31,4 @@
}
}
}
}
}
3 changes: 2 additions & 1 deletion example-app/src/hello.green.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
import React from 'react'
import { getFlavor } from 'flavors.macro'

export default class Hello extends React.Component {
render() {
document.body.style.background = "#0F0";
return (
<div style={{ color: "#F00" }}>
Hello green!
Hello {getFlavor("layout-theme")}!
</div>
)
}
Expand Down
Loading

0 comments on commit 8ac1461

Please sign in to comment.