更新组件

.eslintrc.js

@@ -7,6 +7,9 @@ module.exports = {
   parserOptions: {
     parser: "babel-eslint"
   },
+  globals: {
+    _: true
+  },
   rules: {
     "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
     "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off"

.gitignore

@@ -1,6 +1,7 @@
 .DS_Store
 node_modules
 /dist
+theme
 
 # local env files
 .env.local
@@ -14,6 +15,7 @@ yarn-error.log*
 # Editor directories and files
 .idea
 .vscode
+.history
 *.suo
 *.ntvs*
 *.njsproj

.npmignore

@@ -1,5 +1,20 @@
 node_modules
 .vscode
 .git
+.history
 build
-docs
+docs
+src
+public
+demo
+langs
+docs
+img
+.gitignore
+.eslintrc.js
+.browserslistrc
+babel.config.js
+postcss.config.js
+vue.config.js
+theme
+组件API.md

build/clear.js

@@ -0,0 +1,28 @@
+const fs = require("fs");
+const path = require("path");
+
+function removeJs(src) {
+  fs.readdir(src, function(err, paths) {
+    if (err) {
+      throw err;
+    }
+    paths.forEach(function(file) {
+      let curPath = path.join(src, file),
+        stat = fs.statSync(curPath);
+
+      // 判断是否为css文件
+      if (stat.isFile() && path.extname(curPath) !== ".css") {
+        fs.unlinkSync(curPath);
+      } else if (stat.isDirectory()) {
+        removeJs(curPath);
+      }
+    });
+  });
+}
+
+function main() {
+  let cwd = process.cwd();
+  removeJs(path.join(cwd, "theme"));
+}
+
+main();

build/components.js

@@ -1,10 +1,38 @@
 module.exports = {
-  scroll: "./src/components/scroll/index.js",
+  base: "./src/components/base.js",
+  alert: "./src/components/alert/index.js",
+  badge: "./src/components/badge/index.js",
+  button: "./src/components/button/index.js",
+  checkbox: "./src/components/checkbox/index.js",
   collapse: "./src/components/collapse/index.js",
-  row: "./src/components/layout/index.js",
-  col: "./src/components/layout/colIndex.js",
+  datepicker: "./src/components/datepicker/index.js",
+  dialog: "./src/components/dialog/index.js",
+  dropdown: "./src/components/dropdown/index.js",
+  input: "./src/components/input/index.js",
+  form: "./src/components/form/index.js",
+  layout: "./src/components/layout/index.js",
+  list: "./src/components/list/index.js",
+  loading: "./src/components/loading/index.js",
+  message: "./src/components/message/index.js",
+  notification: "./src/components/notification/index.js",
+  pagination: "./src/components/pagination/index.js",
+  popconfirm: "./src/components/popconfirm/index.js",
+  popover: "./src/components/popover/index.js",
+  popups: "./src/components/popups/index.js",
+  radio: "./src/components/radio/index.js",
+  scroll: "./src/components/scroll/index.js",
+  select: "./src/components/select/index.js",
+  slider: "./src/components/slider/index.js",
+  steps: "./src/components/steps/index.js",
+  switch: "./src/components/switch/index.js",
+  tabs: "./src/components/tabs/index.js",
+  table: "./src/components/table/index.js",
+  timepicker: "./src/components/timepicker/index.js",
+  tooltip: "./src/components/tooltip/index.js",
+  upload: "./src/components/upload/index.js",
   bar: "./src/components/chart/bar/index.js",
   line: "./src/components/chart/line/index.js",
+  percent: "./src/components/chart/percent/index.js",
   pie: "./src/components/chart/pie/index.js",
-  percent: "./src/components/chart/percent/index.js"
+  progress: "./src/components/chart/percent/progress.js"
 };

build/config.js

@@ -0,0 +1,11 @@
+function getConfig(theme) {
+  return {
+    isProd: process.env.NODE_ENV === "production",
+    variables: `@import "src/scss/varibles.scss";`,
+    outPath:"/dist"
+  };
+}
+
+module.exports = {
+  getConfig
+};

build/md-loader/index.js

@@ -45,8 +45,6 @@ module.exports = function(source) {
     commentEnd = content.indexOf(endTag, commentStart + startTagLen);
   }
 
-  // 仅允许在 demo 不存在时，才可以在 Markdown 中写 script 标签
-  // todo: 优化这段逻辑
   let pageScript = "";
   if (componenetsString) {
     pageScript = `<script>
@@ -66,7 +64,7 @@ module.exports = function(source) {
   output.push(content.slice(start));
   return `
     <template>
-      <section class="content moui-doc">
+      <section class="content reasy-doc">
         ${output.join("")}
         <side-link></side-link>
       </section>

build/publish.js

@@ -0,0 +1,105 @@
+const path = require("path");
+const webpack = require("webpack");
+const component = require("./webpack.component.js");
+const publish = require("./webpack.publish.js");
+const scss = require("./webpack.scss.js");
+const { getConfig } = require("./config");
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
+const _ = require("lodash");
+
+let themes = [];
+
+function webpackPromise(config) {
+  console.log("组件打包处理中...");
+  return new Promise((resolve, reject) => {
+    webpack(config, (err, stats) => {
+      if (err) {
+        reject(err);
+        return;
+      }
+
+      process.stdout.write(
+        stats.toString({
+          chunks: true, // 使构建过程更静默无输出
+          colors: true // 在控制台展示颜色
+        }) + "\n"
+      );
+
+      resolve();
+    });
+  });
+}
+
+function correctConfig(cfg, variables, outPath, theme) {
+  outPath = path.join(path.resolve(__dirname, ".."), outPath);
+  cfg.mode = "production";
+
+  cfg.plugins.push(
+    new webpack.DefinePlugin({
+      "process.env.THEME": JSON.stringify(theme)
+    })
+  );
+
+  if (cfg.noCss) {
+    delete cfg.noCss;
+    cfg.module.rules.push({
+      test: /\.(scss|css)$/,
+      use: [
+        "css-loader",
+        "postcss-loader",
+        {
+          loader: "sass-loader",
+          options: {
+            prependData: variables
+          }
+        }
+      ],
+      exclude: /node_modules/
+    });
+  } else {
+    cfg.module.rules.push({
+      test: /\.(scss|css)$/,
+      use: [
+        MiniCssExtractPlugin.loader,
+        "css-loader",
+        "postcss-loader",
+        {
+          loader: "sass-loader",
+          options: {
+            prependData: variables
+          }
+        }
+      ],
+      exclude: /node_modules/
+    });
+  }
+
+  cfg.output.path = outPath;
+}
+
+function run() {
+
+  compile();
+}
+
+function compile() {
+  let configs = [];
+
+  let scssConfig = _.cloneDeep(scss);
+  let componentConfig = _.cloneDeep(component);
+  let publishConfig = _.cloneDeep(publish);
+
+  const { variables, outPath } = getConfig();
+  correctConfig(scssConfig, variables, path.join(outPath, "/lib"));
+  correctConfig(componentConfig, variables, path.join(outPath, "/lib"));
+  correctConfig(publishConfig, variables, outPath);
+  configs.push(scssConfig, componentConfig, publishConfig);
+  console.log("******************************************");
+  console.log("风格处理：");
+  console.log("变量文件：", variables);
+  console.log("输出地址：", outPath);
+
+  return webpackPromise(configs);
+}
+
+run();

build/scss.js

@@ -1,10 +1,38 @@
 module.exports = {
-  scroll: "./src/scss/components/scroll.scss",
+  base: "./src/scss/base.scss",
+  alert: "./src/scss/components/alert.scss",
+  badge: "./src/scss/components/badge.scss",
+  button: "./src/scss/components/button.scss",
+  checkbox: "./src/scss/components/checkbox.scss",
   collapse: "./src/scss/components/collapse.scss",
-  row: "./src/scss/components/row.scss",
-  col: "./src/scss/components/col.js",
+  datepicker: "./src/scss/components/datepicker.scss",
+  dialog: "./src/scss/components/dialog.scss",
+  dropdown: "./src/scss/components/dropdown.scss",
+  input: "./src/scss/components/input.scss",
+  form: "./src/scss/components/form.scss",
+  layout: "./src/scss/components/row.scss",
+  list: "./src/scss/components/list.scss",
+  loading: "./src/scss/components/loading.scss",
+  message: "./src/scss/components/message.scss",
+  notification: "./src/scss/components/notification.scss",
+  pagination: "./src/scss/components/pagination.scss",
+  popconfirm: "./src/scss/components/popconfirm.scss",
+  popover: "./src/scss/components/popover.scss",
+  popups: "./src/scss/components/popups.scss",
+  radio: "./src/scss/components/radio.scss",
+  scroll: "./src/scss/components/scroll.scss",
+  select: "./src/scss/components/select.scss",
+  slider: "./src/scss/components/slider.scss",
+  steps: "./src/scss/components/steps.scss",
+  switch: "./src/scss/components/switch.scss",
+  tabs: "./src/scss/components/tabs.scss",
+  table: "./src/scss/components/table.scss",
+  timepicker: "./src/scss/components/timepicker.scss",
+  tooltip: "./src/scss/components/tooltip.scss",
+  upload: "./src/scss/components/upload.scss",
   bar: "./src/scss/components/chart-bar.scss",
   line: "./src/scss/components/chart-line.scss",
+  percent: "./src/scss/components/chart-percent.scss",
   pie: "./src/scss/components/chart-pie.scss",
-  percent: "./src/scss/components/chart-percent.scss"
+  progress: "./src/scss/components/chart-percent.scss"
 };

build/webpack.component.js

@@ -1,16 +1,23 @@
 const path = require("path");
-const root = path.resolve(__dirname, ".."); // 项目的根目录绝对路径
 const { VueLoaderPlugin } = require("vue-loader");
 const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
 const config = require("./components.js");
 
 module.exports = {
+  noCss: true,
+  //解决打包后出现多个Vue的问题
+  externals: {
+    vue: {
+      root: "Vue",
+      commonjs: "vue",
+      commonjs2: "vue",
+      amd: "vue"
+    }
+  },
   entry: config, // 入口文件路径
   output: {
-    path: path.join(root, "dist/lib"), // 出口目录
     chunkFilename: "[name].js?[chunkhash:5]",
-    filename: "[name].js",
-    //library: 'reasyUIVue',
+    filename: "[name]/index.js",
     libraryTarget: "commonjs2",
     libraryExport: "default"
   },
@@ -41,19 +48,13 @@ module.exports = {
         loader: "vue-loader",
         options: {
           loaders: {
-            js: "babel-loader",
-            //css: 'style-loader',
-            scss: "vue-style-loader!css-loader!sass-loader?indentedSyntax"
+            js: "babel-loader"
           },
           extractCSS: true
         }
       }
     ]
   },
-  optimization: {
-    //webpack 4
-    minimize: false
-  },
   devtool: false,
   plugins: [new VueLoaderPlugin(), new UglifyJsPlugin()]
 };