PostCSS css-next - 全局变量，无需使用@import

Question

我在variables.css

中有一个包含CSS变量的文件:root{}

现在，每当我需要在另一个.css文件中使用它时，我会使用：

  

@import './path/to/variables.css'。

我想知道是否有办法在全球范围内提供variables.css，而无需每次需要时都将其导入。

我尝试在customProperties插件上使用选项cssnext，但是在给js对象编译css时出错... 我将React与webpack 1一起使用，作为postcss插件，我有import，mixins，cssnext和nested。

由于

Answer 1

据我所知，不，但你可以让你的生活更轻松。在您的导入配置中，设置路径，例如：

cssImport({ path: './src' })

假设variables.css位于src/variables.css，您可以执行以下操作：

@import 'variables';

而不是点回到树上找到正确的位置。

Answer 2

您将 variable.css 导入 main.css（您的全局 css 文件）

//main.css
@import "./variable.css";

然后在_app.js中导入main.css：

// Your path to main.css
import "../assets/main.css"