1初始化项目并且引入scss

vue.vonfig.js

这个文件引入mian.scss

css: {
    // 是否使用css分离插件 ExtractTextPlugin
    extract: true,
    // 开启 CSS source maps?
    sourceMap: false,
    // css预设器配置项
    loaderOptions: {
      scss: { 
        prependData: `@import "./src/styles/main.scss";`
      }
    }
  },

main.scss.凡是scss文件统统引入到mia.scss中

// @import "./elementui.scss";
@import "./normalize.scss";

@for $i from 1 through 110 {
  .margin-left-#{$i} {
    margin-left: (1px * $i);
  }
}
.text-overflow {
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}

App.vue

一定是如下格式。 scss文件才会生效

<style lang="scss">
/* 不能去掉 */
#app {
}
</style>
原文地址:https://www.cnblogs.com/xiaoliziaaa/p/13592149.html