Colors Tailwind CSS扩展Tailwind.config.js中的标准颜色。当我尝试扩展颜色时,所有其他颜色都会被删除
当我尝试向tailwind.css添加一些颜色时,所有其他颜色都会被删除。 这是我的tailwind.config.js文件:Colors Tailwind CSS扩展Tailwind.config.js中的标准颜色。当我尝试扩展颜色时,所有其他颜色都会被删除,colors,tailwind-css,Colors,Tailwind Css,当我尝试向tailwind.css添加一些颜色时,所有其他颜色都会被删除。 这是我的tailwind.config.js文件: const defaultTheme = require('tailwindcss/defaultTheme'); module.exports = { purge: [ './vendor/laravel/jetstream/**/*.blade.php', './storage/framework/views/*.php',
const defaultTheme = require('tailwindcss/defaultTheme');
module.exports = {
purge: [
'./vendor/laravel/jetstream/**/*.blade.php',
'./storage/framework/views/*.php',
'./resources/views/**/*.blade.php',
],
theme: {
extend: {
fontFamily: {
sans: ['Nunito', ...defaultTheme.fontFamily.sans],
},
},
// colors: {
// smoke: {
// darkest: 'rgba(0, 0, 0, 0.9)',
// darker: 'rgba(0, 0, 0, 0.75)',
// dark: 'rgba(0, 0, 0, 0.6)',
// DEFAULT: 'rgba(0, 0, 0, 0.5)',
// light: 'rgba(0, 0, 0, 0.4)',
// lighter: 'rgba(0, 0, 0, 0.25)',
// lightest: 'rgba(0, 0, 0, 0.1)',
// },
// },
colors: {
'smoke-darkest': 'rgba(0, 0, 0, 0.9)',
'smoke-darker': 'rgba(0, 0, 0, 0.75)',
'smoke-dark': 'rgba(0, 0, 0, 0.6)',
'smoke': 'rgba(0, 0, 0, 0.5)',
'smoke-light': 'rgba(0, 0, 0, 0.4)',
'smoke-lighter': 'rgba(0, 0, 0, 0.25)',
'smoke-lightest': 'rgba(0, 0, 0, 0.1)',
},
},
variants: {
opacity: ['responsive', 'hover', 'focus', 'disabled'],
},
plugins: [require('@tailwindcss/ui')],
};
在我“运行NPMDev”之后,除了我尝试添加的颜色之外,没有其他颜色。
如何添加这些颜色而不删除其他颜色
注释部分只是不同语法的一种尝试,它们的工作原理相同。您需要在扩展对象中添加颜色:
module.exports = {
theme: {
extend: {
colors: {
'smoke-darkest': 'rgba(0, 0, 0, 0.9)',
'smoke-darker': 'rgba(0, 0, 0, 0.75)',
'smoke-dark': 'rgba(0, 0, 0, 0.6)',
'smoke': 'rgba(0, 0, 0, 0.5)',
'smoke-light': 'rgba(0, 0, 0, 0.4)',
'smoke-lighter': 'rgba(0, 0, 0, 0.25)',
'smoke-lightest': 'rgba(0, 0, 0, 0.1)',
}
}
}
}
查看文档:非常感谢!尽管我已经阅读了文档,我还是错过了这个细微的差别。。。