search

jan-dh / sketch-tailwind

A plugin that tries to bridge the gap between designs and code. Sketch Tailwind lets you export aspects of a design made in Sketch to a javascript theme file that you can import into your TailwindCSS config
MIT License
195 stars 8 forks source link

Terminology #4

Closed PointZeroSeven closed 5 years ago

PointZeroSeven commented 5 years ago

What is a spread operator?

jan-dh commented 5 years ago

The spread operator is fairly new javascript operator that allows an iterable such as an array expression or string to be expanded in places where zero or more arguments (for function calls) or elements (for array literals) are expected, or an object expression to be expanded in places where zero or more key-value pairs (for object literals) are expected.

More info on the spread operator can be found here.

If you have a look at the exported theme file you'll notice that the theme variable is an object with nested objects (colors, fontSizes, fonts).

By doing something like this in your tailwind configuration

let colors = {
  'transparent': 'transparent',
  ...theme.colors,

you are spreading the values of the object in the theme file into the existing colors variable of the tailwind configuration.