如何将 sass 列表作为数组导出到 js 文件

Posted 2023-03-06

【中文标题】如何将 sass 列表作为数组导出到 js 文件

【英文标题】：How to export sass list as array to js file

【发布时间】：2022-01-10 02:44:24

【问题描述】：

我有一个包含 sass 变量的文件，它有一个这样的列表：

$columnsClasses: 'Id', 'Phase', 'Status', 'Source', 'Date'

所以我在同一个文件中写了以下内容来导出这个列表

:export 
columnsClasses: $columnsClasses;

由于某些原因，我需要将此列表导入 JS 文件。但是当我这样做时，我只得到一个大字符串而不是数组。

像这样：'"Id", "Phase", "Status", "Source", "Date"'

在JS中如何导出sass列表来获取数组？

【问题讨论】：

也许不可能……您是否尝试用括号或方括号编写您的列表？

数组确实不是 SASS 的一部分

【参考方案1】：

目前ICSS 将任何导出的值视为文字字符串（我不知道是否可以使用任何可互换的数据类型语法扩展提案）。

exportedValue 不需要被引用，它已经被视为文字字符串。

因此，您必须将其转换为 javascript 中的数组。 不过，您可以做的是利用有用的、已建立的和标准化的 JSON 语法，然后自己添加括号：

// constants.module.scss
$columnsClasses: 'Id', 'Phase', 'Status', 'Source', 'Date';

:export 
    columnsClasses: [$columnsClasses];

在你的 js 中

import constants from './constants.module.scss'

const columnsClasses = JSON.parse(constants.columnsClasses);

columnsClasses.forEach(console.log);