scss 變量解析不了

1、scss 變量解析不了scss 變量解析不了的問題，這就難堪了，我們都知道 scss 變量是如下定義 $width: "100px" 我正常用法的時候，應當是如下： .box width: $width; 是的，上面引用變量是沒有任何問題的 現(xiàn)在來看看今日遇到什么問題了呢？ / 尾隨換膚 mixin bg-theme-image($url) each $theme-name, $theme-map in $themes .theme-"" + $theme-name & background: url($u

2、rl + "-" + $theme-name + ".png") no-repeat; background-size: 100%; media (-webkit-min-device-pixel-ratio: 2),(min-device-pixel-ratio: 2) background: url($url + "-" + $theme-name + "-2x.png") no-repeat; background-size: 100%; med

3、ia (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3) background: url($url + "-" + $theme-name + "-3x.png") no-repeat; background-size: 100%; 上面的 $theme-name 是解析不出來的，在 本地 npm run dev 是沒有任何問題的，但是呢？在我 npm run build 的時候，卻報錯了，沒有打包勝利，就是這個變量解析不了的緣由，導致路勁找不到對

4、應的 url 路徑 修改成如下： / 尾隨換膚 mixin bg-theme-image($url) each $theme-name, $theme-map in $themes .theme-"" + $theme-name & background: url($url + "-" + $theme-name + ".png") no-repeat; background-size: 100%; media (-webkit-min-device-pixel-rati

5、o: 2),(min-device-pixel-ratio: 2) background: url($url + "-" + $theme-name + "-2x.png") no-repeat; background-size: 100%; media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3) background: url($url + "-" + $theme-name + "-

6、3x.png") no-repeat; background-size: 100%; 給 $theme-name 加上 $theme-name去解析 這個變量就不會報錯，打包也沒有問題了 關于 scss 插值問題總結如下 普通我們定義的變量都為屬性值，可挺直用法，但是假如變量作為屬性或在某些特別狀況下則必需要以 $variables 形式用法。 $borderdirection: top !default; $basefontsize: 12px !default; $baselineheight: 1.5 !default; / 應用于 class 和屬性 .border-$borderdirection border-$