y2t-common-css v1.0.11

前端样式规范-PC

背景

因各项目繁多，UI设计稿仅能作为参考，为统一各项目的样式，利用sass预处理语言和html-class特性使用本规范作为前端开发指南。

Font-size规范

项目中仅使用fs-12、fs-14、fs-16、fs-18、fs-20, 5种字体大小进行开发（特殊情况除外）。

fs-14例子：

Padding规范

Margin规范（同上）

其他常用class，Text-align、Font-weight

安装方法：

安装y2t-common-css并改造vue.config.js

npm install y2t-common-css

在main.js（入口文件）中引入，用于支持 使用方法：1.1

//引入了y2t0common-css/index.css
import 'y2t-common-css';

改造vue.config.js中sass的配置，让y2t-common-css可以全局进行使用, 用于支持 使用方法：1.2

module.exports = {
  devServer: {},
  chainWebpack: config => {
  },
  css: {
    loaderOptions: {
      sass: {
        // so this assumes you have a file named `y2t-common-css/@extend.scss`
        data: `
               @import "y2t-common-css/@extend.scss";
              `
      }
    }
  }
};

使用方法：

1.1 直接class应用

1.2 .scss文件中或.vue文件中使用@extend 继承（利用sass语法）