Estoy revisando la configuración del tema en Tailwind CSS. Parece realmente poderoso, pero tengo problemas para usar mis tokens de diseño dentro de la configuración.
Tengo mis tokens distribuidos a través de npm, pero no sé cómo puedo incluirlos en mi tailwind.config.js . ¿Hay alguna forma de incluirlos así? ¿Debería usar un enfoque diferente?
// What I'm trying to achieve import DesignTokens from "@my-design-system/tokens"; module.exports = { content: ["./src/**/*.{js,jsx,ts,tsx}"], theme: { extend: {}, colors: { blue: DesignTokens.COLOR_BLUE_700, }, }, plugins: [], };me sale error
SyntaxError: Cannot use import statement outside a moduleCualquier información será muy apreciada.
Gracias
Como se indica en los comentarios, usar la import es mezclar formatos de módulos.
Lo tengo funcionando con la siguiente configuración.
// I have tokens available in many different formats thanks to Style Dictionary. Here we use JSON. const DesignTokens = require("@my-design-system/tokens.json"); module.exports = { content: ["./src/**/*.{js,jsx,ts,tsx}"], theme: { extend: {}, colors: { blue: { 700: DesignTokens["color-blue-700"], }, }, }, plugins: [], };