如何在 js 中使用 less 的全局變量

1、在 less 文件中定義變量並將其導出為 js，CSS Module 有一個:export關鍵字，它在功能上等同於 ES6 的關鍵字export，即導出一個 js 對象。

// ./styles/variables.less

@themeColor: #00978d;

// 導出變量
:export {
    exportedKey: @themeColor; 
}

2、在需要使用的頁面導入

<template>
  <div id="app" class="box"></div>
</template>

<script>
import variables from './styles/variables.less';
export default {
  data() {
    return {
      variables,
    };
  },
  created() {
    console.log(this.variables, "variables");
  }
};
</script>