Ionic framework SASS错误，自定义离子图标[ionic 3]

所以基本上，我正在尝试在我的ionic 3项目中创建一个自定义图标，我知道ionic已经为我们提供了他们的示例图标（例如：Ionics） 然而，我正在努力使我的定制适合我的项目。 我一直在遵循本教程，根据自己的需要创建自定义的。问题是当我试图构建我的项目时，我遇到了这个错误

> Sass Error Invalid CSS after "}": expected 1 selector or at-rule, was
> ".icon@include makeI"

以下是我完整的scss代码：

> @font-face {
>   font-family: 'icomoon';     src: 
> url('../assets/fonts/icomoon.eot?ai7wni');    src: 
> url('../assets/fonts/icomoon.eot?ai7wni#iefix')
> format('embedded-opentype'),
>   url('../assets/fonts/icomoon.ttf?ai7wni') format('truetype'),
>   url('../assets/fonts/icomoon.woff?ai7wni') format('woff'),
>   url('../assets/fonts/icomoon.svg?ai7wni#icomoon') format('svg');
>   font-weight: normal;    font-style: normal; }
> 
> [class^="icon-"], [class*=" icon-"] {     /* use !important to prevent
> issues with browser extensions that change fonts */   font-family:
> 'icomoon' !important;     speak: none;    font-style: normal;     font-weight:
> normal;   font-variant: normal;   text-transform: none;   line-height: 1;
> 
>   /* Better Font Rendering =========== */     -webkit-font-smoothing:
> antialiased;  -moz-osx-font-smoothing: grayscale; }
> 
> // ../assets/
> 
> 
> @mixin makeIcon($arg, $val) {   .ai-#{$arg}:before ,  
> .ion-ios-sm-#{$arg}:before ,   .ion-ios-sm-#{$arg}-outline:before ,  
> .ion-md-sm-#{$arg}:before ,   .ion-md-sm-#{$arg}-outline:before  {
>     content: $val;
>     font-size: 26px;   } }
> 
> 
> .icon@include makeIcon(home,'\e900'); .icon@include makeIcon(pipeline,
> '\e901'); .icon@include makeIcon(leave, '\e902'); .icon@include
> makeIcon(meeting-room, '\e903'); .icon@include makeIcon(logout,
> '\e904');

---

感谢您的帮助，谢谢

从

中删除
.icon
。icon@includemakeIcon（…

创建

mixin

后，可以将其用作以

@include

开头的CSS声明

mixin允许您创建一组CSS声明，以便在整个站点中重复使用。您甚至可以传入值以使mixin更加灵活

所以你的

。icon@include

基本上是一个语法错误

---

参考：

从

中删除
。图标
。icon@includemakeIcon（…

已解决！谢谢，伙计，你能告诉我吗？我为什么要删除该部分？