8 ms·
They've allowed "styled-components" to work though, which is pretty nice. I always thought of them as providing a way to parse DSLs directly in your code. For e
by renlo 4y ago
They've allowed "styled-components" to work though, which is pretty nice. I always thought of them as providing a way to parse DSLs directly in your code. For example, a fictional way to generate some config could look like this (using tagged templates):
const thingies = ["a", "b"];
const config = yaml`
- foo
- bar
- baz
- thingies: ${thingies.map(thing => yaml`- thing: ${thing}`)}
`;
// config = ["foo", "bar", "baz", { "thingies": [{"thing": "a"}, {"thing": "b"}] }]
At a company I worked at people were generating YAML using Jinja templates, but tagged templates to me would be a better approach. Is it hard to read? It can be, but compared to the alternatives it's not too bad.
- monkpit 4y agoconst thingies = ["a", "b"]; const thingToYaml = thing => yaml`- thing: ${thing}` const thingiesYaml = thingies.map(thingToYaml) const config = yaml` - foo - bar - baz - thingies: ${thingiesYaml} `; It doesn’t have to be hard to read
- shhsshs 4y agoIn this example, why use YAML at all?... const thingies = ["a", "b"]; const config = [ "foo", "bar", "baz", { thingies: thingies.map(thing => ({ thing })), }, ] // config = ["foo", "bar", "baz", { "thingies": [{"thing": "a"}, {"thing": "b"}] }]
- zeroonetwothree 4y agoRight, it's not a great example since yaml is intentionally equivalent to JS objects.
- lloydatkinson 4y agoWell, styled components also has a plain object syntax which I think a lot of people prefer me included.