update imports, use ESM

This commit is contained in:
madrilene 2024-06-03 11:04:35 +02:00
parent b7c2308091
commit ec20c4d731

View file

@ -1,20 +1,20 @@
/* © Andy Bell - https://buildexcellentwebsit.es/ */
/* © Andy Bell - https://github.com/Set-Creative-Studio/cube-boilerplate */
const plugin = require('tailwindcss/plugin');
const postcss = require('postcss');
const postcssJs = require('postcss-js');
import plugin from 'tailwindcss/plugin';
import postcss from 'postcss';
import postcssJs from 'postcss-js';
const clampGenerator = require('./src/utilities/clamp-generator.js');
const tokensToTailwind = require('./src/utilities/tokens-to-tailwind.js');
import {clampGenerator} from './src/_config/utils/clamp-generator.js';
import {tokensToTailwind} from './src/_config/utils/tokens-to-tailwind.js';
// Raw design tokens
const colorTokens = require('./src/_data/designTokens/colors.json');
const fontTokens = require('./src/_data/designTokens/fonts.json');
const spacingTokens = require('./src/_data/designTokens/spacing.json');
const textSizeTokens = require('./src/_data/designTokens/textSizes.json');
const textLeadingTokens = require('./src/_data/designTokens/textLeading.json');
const textWeightTokens = require('./src/_data/designTokens/textWeights.json');
const viewportTokens = require('./src/_data/designTokens/viewports.json');
import colorTokens from './src/_data/designTokens/colors.json';
import fontTokens from './src/_data/designTokens/fonts.json';
import spacingTokens from './src/_data/designTokens/spacing.json';
import textSizeTokens from './src/_data/designTokens/textSizes.json';
import textLeadingTokens from './src/_data/designTokens/textLeading.json';
import textWeightTokens from './src/_data/designTokens/textWeights.json';
import viewportTokens from './src/_data/designTokens/viewports.json';
// Process design tokens
const colors = tokensToTailwind(colorTokens.items);
@ -24,14 +24,15 @@ const fontWeight = tokensToTailwind(textWeightTokens.items);
const fontLeading = tokensToTailwind(textLeadingTokens.items);
const spacing = tokensToTailwind(clampGenerator(spacingTokens.items));
module.exports = {
export default {
content: ['./src/**/*.{html,js,md,njk,liquid,webc}'],
presets: [],
theme: {
screens: {
ltsm: {max: `${viewportTokens.sm}px`},
sm: `${viewportTokens.sm}px`,
md: `${viewportTokens.md}px`
md: `${viewportTokens.md}px`,
navigation: `${viewportTokens.navigation}px`
},
colors,
spacing,
@ -132,9 +133,7 @@ module.exports = {
Object.keys(group).forEach(key => {
addUtilities({
[`.${prefix}-${key}`]: postcssJs.objectify(
postcss.parse(`${property}: ${group[key]}`)
)
[`.${prefix}-${key}`]: postcssJs.objectify(postcss.parse(`${property}: ${group[key]}`))
});
});
});