Grunt SASS将反向内容编译为错误的unicode字形

时间:2017-10-29 19:59:01

标签: css unicode sass gruntjs

我们在SASS项目中有以下代码:

.icon-mail:before { content: '\e800'; }

Grunt SASS在某些开发计算机上编译成此代码:

.icon-mail:before {
    content: "";

然后打破浏览器中的显示(测试Chrome和Firefox)。

为了混淆它在设计师OSX Mac上按预期编译的东西,而不是在开发人员的Ubuntu机器上编译。

期待什么&工作原理:

.icon-mail:before { 
    content: '\e800'; 

我在Github中发现这个问题看起来很相似 - 但是没有明确的解决方法:https://github.com/sass/sass/issues/620

1 个答案:

答案 0 :(得分:0)

之前我遇到过类似问题,经过大量搜索后最终使用this建议。我已将其修改为更通用,并且它导致此功能在多个项目中对我有效。在Windows / Linux / OS X上编译良好。

<html>
	<body>
		<span id="buildings"></span>
		<script>
			var cookies = 0;
			var cookies_produced = 0;
			var altogether_productivity = 0; // counts productivity of buildings except clicker
			
			var cookies_display = document.getElementById("cookies");
			var cookies_produced_display = document.getElementById("cookies_produced");
			
			var buildings = document.getElementById("buildings");
			
			class Building
			{
				constructor(name, productivity, price)
				{
					this.name = name;
					this.level = 0;
					this.price = price;
					this.productivity = productivity;
			
					// variables for displaying
					// definition of areas
					this.area = document.createElement("span");
					this.area.id = name;
			
					this.level_display = document.createElement("span");
					this.level_display.id = this.name + "_level";
			
					this.productivity_display = document.createElement("span");
					this.productivity_display.id = this.name + "_productivity";
			
					this.price_display = document.createElement("span");
					this.price_display.id = this.name + "_price";
			
					this.button = document.createElement("button");
					this.button.innerHTML = "Improve";
			        this.button.onclick = this.improve;
			
					// put together
					this.area.append(document.createTextNode(name + " Level: "));
					this.area.append(this.level_display);
					this.area.append(document.createElement("br"));
			
					this.area.append(document.createTextNode("Cookies per Second: "));
					this.area.append(this.productivity_display);
					this.area.append(document.createElement("br"));
			
					this.area.append(document.createTextNode("Improvement Price: "));
					this.area.append(this.price_display);
					this.area.append(document.createElement("br"));
			
					this.area.append(this.button);
					this.area.append(document.createElement("br"));
					this.area.append(document.createElement("br"));
				}
				
			    improve()
			    {
			        console.log("cookies" + cookies);
			        console.log(this.price);
			        if(cookies >= this.price)
			        {
			            cookies -= this.price;
			            this.level += 1;
			            this.price *= 2;
			            altogether_productivity += this.productivity;
			        }
			        else
			        {
			            alert("Not enough cookies!");
			        }
			    }
			
				renew_display()
				{
					this.level_display.innerHTML = this.level;
					this.productivity_display.innerHTML = this.get_production_value();
					this.price_display.innerHTML = this.price;
				}
			
			
				set_visible()
				{
					buildings.append(this.area);
					this.renew_display();
				}
			
				get_production_value()
				{
					return this.level * this.productivity;
				}
			
				produce()
				{
					cookies += this.get_production_value();
				}
			}

			var building = new Building("Building", 5, 1000)
			building.set_visible();
			building.improve();
		</script>
	</body>
</html>