javascript - 在 Angular 中共享来自 JS 和 LESS 的变量

Question

我有一个网站，现在需要针对移动设备进行一些更改。

我打算使用媒体查询来将 CSS 应用于那些较小的 div。

@media 屏幕和(最大宽度:320px){

但是在代码中，我还需要根据屏幕的大小更改某些数组的内容(绘制一些布局等...)。

现在，我可以做 2 个变量，

少一分之一@mobileSize: 320 js 中的一个(常量) mobileSize = 320

但是我想知道是否有办法为 LESS 和 JS 共享相同的变量，所以只有 1 个地方可以放置这些变量。

谢谢

Answer 1

如果您想长期节省时间，我相信 @julianobrasil 提出的现有解决方案是正确的!

但是，如果您确实想这样做，这里有两个建议:

使用 JSON 文件:

在 json 文件中定义变量并在 LESS 和 JS 中导入该文件。您需要使用加载器将 json 加载到 less 中，我自己没有这样做，但这应该可以 less-json-import-loader

导出 CSS 中的值并在 JS 中读取:

您可以使用getCompulatedStyle读取JS中的CSS值。 Here's a post showing how to do it for SASS但 LESS 的原理应该是一样的。