clean style

build/build-style.js

@@ -1,68 +1,25 @@
-/**
- * 编译样式文件
- * iview.css 是基础组件css
- * iview.pack.css 是套装的全部css
- * iview.all.css 是基础组件加套装的全部css
- * packages/*.css 是某个套装的css
- * article.css 是文章排版的css
- * */
 var gulp = require('gulp');
 var minifyCSS = require('gulp-minify-css');
 var less = require('gulp-less');
 var rename = require('gulp-rename');
-var concat = require('gulp-concat');
+var autoprefixer = require('gulp-autoprefixer');
 
-// 组件的基础css
-gulp.task('base', function () {
+// 编译less
+gulp.task('css', function () {
      gulp.src('../src/styles/index.less')
          .pipe(less())
+         .pipe(autoprefixer({
+            browsers: ['last 2 versions']
+         }))
          .pipe(minifyCSS())
          .pipe(rename('iview.css'))
          .pipe(gulp.dest('../dist/styles'))
 });
 
-// 字体
+// 拷贝字体文件
 gulp.task('fonts', function () {
     gulp.src('../src/styles/common/iconfont/fonts/*.*')
         .pipe(gulp.dest('../dist/styles/fonts'))
 });
 
-// 文章排版
-gulp.task('article', function () {
-    gulp.src('../src/styles/article/index.less')
-        .pipe(less())
-        .pipe(minifyCSS())
-        .pipe(rename('article.css'))
-        .pipe(gulp.dest('../dist/styles'))
-});
-
-// 套装的全部css
-gulp.task('pack-all', function () {
-    gulp.src('../src/styles/package.less')
-        .pipe(less())
-        .pipe(minifyCSS())
-        .pipe(rename('iview.pack.css'))
-        .pipe(gulp.dest('../dist/styles'))
-});
-
-// 每个套装的css
-gulp.task('pack', function () {
-    gulp.src(['../src/styles/packages/*.less', '!../src/styles/packages/index.less'])
-        .pipe(less())
-        .pipe(minifyCSS())
-        .pipe(rename({
-            prefix: 'iview.pack.'
-        }))
-        .pipe(gulp.dest('../dist/styles/packages'))
-});
-
-// 全部css(包含组件和套装)
-gulp.task('all', function () {
-    gulp.src(['../src/styles/index.less', '../src/styles/package.less'])
-        .pipe(less())
-        .pipe(concat('iview.all.css'))
-        .pipe(minifyCSS())
-        .pipe(gulp.dest('../dist/styles'))
-});
-
-gulp.task('default', ['base', 'fonts', 'article', 'pack-all', 'pack', 'all']);
+gulp.task('default', ['css', 'fonts']);

package.json

@@ -56,7 +56,7 @@
     "extract-text-webpack-plugin": "^1.0.1",
     "file-loader": "^0.8.5",
     "gulp": "^3.9.1",
-    "gulp-concat": "^2.6.0",
+    "gulp-autoprefixer": "^3.1.1",
     "gulp-less": "^3.1.0",
     "gulp-minify-css": "^1.2.4",
     "gulp-rename": "^1.2.2",

src/styles/README.md

@@ -2,10 +2,12 @@
 
 ## 目录
 
-|-- components  (组件样式)
+|-- animation  (动画)
 
 |-- common  (全局样式)
 
-|-- packages  (套装)
+|-- components  (组件样式)
 
-|-- themes  (皮肤)
+|-- mixins  (混入)
+
+|-- themes  (主题)

src/styles/package.less

@@ -1,2 +0,0 @@
-@import "./themes/default/index";
-@import "./packages/index";

src/styles/packages/index.less

@@ -1,2 +0,0 @@
-@import "signin";
-@import "signup";

src/styles/packages/signin.less

@@ -1,3 +0,0 @@
-.signin{
-  color: #f00;
-}

src/styles/packages/signup.less

@@ -1,3 +0,0 @@
-.signup{
-  color: #f60;
-}

test/app.vue

@@ -1,7 +1,5 @@
 <style lang="less">
     @import "../src/styles/index.less";
-    @import "../src/styles/package.less";
-    @import "../src/styles/article/index.less";
 </style>
 <style scoped>
 nav {