Frans 6 years ago
parent
commit
f56e844c2a

+ 0 - 23
.babelrc

@@ -1,23 +0,0 @@
-{
-  "presets": [
-    [
-      "@babel/preset-env",
-      {
-        "modules": false,
-        "targets": {
-          "browsers": [
-            "Android >= 4",
-            "iOS >= 8"
-          ]
-        },
-        "useBuiltIns": "usage"
-      }
-      
-    ]
-  ],
-  "plugins": [
-    "@babel/plugin-transform-runtime",
-    "@babel/plugin-syntax-dynamic-import",
-    "istanbul"
-  ]
-}

+ 33 - 0
.babelrc.js

@@ -0,0 +1,33 @@
+const presets = [
+    [
+        "@babel/preset-env",
+        {
+            "modules": false,
+            "targets": {
+                "browsers": [
+                    "Android >= 4",
+                    "iOS >= 8"
+                ]
+            },
+            "useBuiltIns": "usage"
+        }
+
+    ]
+];
+
+const plugins = [
+    "@babel/plugin-transform-runtime",
+    "@babel/plugin-syntax-dynamic-import",
+    "istanbul"
+];
+
+
+if (process.env["NODE_ENV"] === "test") {
+    presets[0][1].modules = "commonjs";
+}
+
+if (process.env["NODE_ENV"] === "production" && process.env["PROD_TYPE"] === "disp") {
+    presets[0][1].useBuiltIns = false;
+}
+
+module.exports = { presets, plugins };

+ 1 - 0
build/webpack.prod.conf.js

@@ -46,6 +46,7 @@ module.exports = merge(webpackBaseConf, {
         filename: 'nutui.js',
         library: 'nutui',
         libraryTarget: 'umd',
+        globalObject: 'this',
         umdNamedDefine: true
     },
     plugins: [

+ 3 - 1
build/webpack.prod.disperse.conf.js

@@ -53,6 +53,7 @@ module.exports = merge(webpackBaseConf, {
         filename: '[name]/[name].js',
         library: '[name]',
         libraryTarget: 'umd',
+        globalObject: 'this',
         umdNamedDefine: true
     },
     externals: {
@@ -76,7 +77,8 @@ module.exports = merge(webpackBaseConf, {
         ]),
         new webpack.DefinePlugin({
             'process.env': {
-                NODE_ENV: '"production"'
+                NODE_ENV: '"production"',
+                PROD_TYPE: '"disp"'
             }
         })
     ],

+ 1 - 0
build/webpack.prod.mini.conf.js

@@ -34,6 +34,7 @@ module.exports = merge(webpackBaseConf, {
         filename: 'nutui.min.js',
         library: 'nutui',
         libraryTarget: 'umd',
+        globalObject: 'this',
         umdNamedDefine: true
     },
     plugins: [

+ 1 - 2
docs/intro.md

@@ -40,9 +40,8 @@ NutUI是一套京东风格的移动端Vue组件库,开发和服务于移动Web
 
 * UMD版 **nutui.js**
 * UMD压缩版 **nutui.min.js**
-* CommonJS版 **nutui.common.js**
 
-> AMD 环境、Webpack 等构建工具环境建议使用 UMD 版,非模块化环境(如通过 `<script>` 标签直接引用)建议使用 UMD 压缩版,服务端渲染请使用 CommonJS 版本
+> AMD 环境、Webpack 等构建工具环境、服务端建议使用 UMD 版,非模块化环境(如通过 `<script>` 标签直接引用)建议使用 UMD 压缩版。
 
 最新稳定版:![npm](https://img.shields.io/npm/v/@nutui/nutui.svg)
 

+ 0 - 7
docs/start.md

@@ -93,13 +93,6 @@ NutUI.install(Vue);
 
 > 注意:这种方式将会导入所有组件
 
-> 服务端渲染请引入NutUI的 **commonjs** 版本 **nutui.common.js**
-
-```javascript
-//服务端渲染使用NutUI的commonjs版本
-import NutUI from '@nutui/nutui/dist/nutui.common.js';
-```
-
 ## 按需加载
 
 以下两种方式都可以实现只加载用到的组件,从而减少加载的文件体积。

+ 2 - 2
package.json

@@ -15,14 +15,14 @@
     "dev:demo": "cross-env NODE_ENV=development webpack-dev-server -d --open --progress --config build/webpack.demo.dev.conf.js",
     "build:demo": "cross-env NODE_ENV=production webpack --hide-modules --progress --config build/webpack.demo.build.conf.js",
     "dev:doc": "cross-env NODE_ENV=development webpack-dev-server -d --open -w --progress --config build/webpack.doc.dev.conf.js",
-    "doc:clear": "node scripts/clearcache.js",
+    "doc:clear": "node scripts/clearCache.js",
     "dev": "npm run dev:demo",
     "dev:carefree": "cross-env NODE_ENV=carefree carefree_env=dev webpack -w --colors --progress --config build/webpack.demo.dev.conf.js",
     "build:doc": "cross-env NODE_ENV=production webpack --hide-modules --progress --config build/webpack.doc.build.conf.js",
     "build:site": "npm run build:demo && npm run build:doc",
     "build:prod": "cross-env NODE_ENV=production webpack --hide-modules --progress --config build/webpack.prod.conf.js && node scripts/createIndexScss.js",
     "build:prodmin": "cross-env NODE_ENV=production webpack --hide-modules --progress --config build/webpack.prod.mini.conf.js",
-    "build:disp": "cross-env NODE_ENV=production webpack --hide-modules --progress --config build/webpack.prod.disperse.conf.js",
+    "build:disp": "cross-env NODE_ENV=production PROD_TYPE=disp webpack --hide-modules --progress --config build/webpack.prod.disperse.conf.js",
     "build:cmn": "cross-env NODE_ENV=production webpack --hide-modules --progress --config build/webpack.prod.cmn.conf.js",
     "build": "npm run build:prod && npm run build:prodmin && npm run build:cmn && npm run build:disp",
     "eslint": "eslint src/packages/**/*.{js,vue}",

+ 130 - 6
src/nutui.js

@@ -1,9 +1,135 @@
-import packages from './packages.js';
-
 import { version } from '../package.json';
 import { packages as pkgList } from './config.json';
 import { locale } from './locales';
 
+
+import Cell from './packages/cell/index.js';
+import './packages/cell/cell.scss';
+import Dialog from './packages/dialog/index.js';
+import './packages/dialog/dialog.scss';
+import Icon from './packages/icon/index.js';
+import './packages/icon/icon.scss';
+import Toast from './packages/toast/index.js';
+import './packages/toast/toast.scss';
+import ActionSheet from './packages/actionsheet/index.js';
+import './packages/actionsheet/actionsheet.scss';
+import Tab from './packages/tab/index.js';
+import './packages/tab/tab.scss';
+import TabPanel from './packages/tabpanel/index.js';
+import './packages/tabpanel/tabpanel.scss';
+import TabBar from './packages/tabbar/index.js';
+import './packages/tabbar/tabbar.scss';
+import Calendar from './packages/calendar/index.js';
+import './packages/calendar/calendar.scss';
+import DatePicker from './packages/datepicker/index.js';
+import './packages/datepicker/datepicker.scss';
+import NavBar from './packages/navbar/index.js';
+import './packages/navbar/navbar.scss';
+import NoticeBar from './packages/noticebar/index.js';
+import './packages/noticebar/noticebar.scss';
+import Switch from './packages/switch/index.js';
+import './packages/switch/switch.scss';
+import Slider from './packages/slider/index.js';
+import './packages/slider/slider.scss';
+import Range from './packages/range/index.js';
+import './packages/range/range.scss';
+import Picker from './packages/picker/index.js';
+import './packages/picker/picker.scss';
+import Progress from './packages/progress/index.js';
+import './packages/progress/progress.scss';
+import Price from './packages/price/index.js';
+import './packages/price/price.scss';
+import Flex from './packages/flex/index.js';
+import './packages/flex/flex.scss';
+import Col from './packages/col/index.js';
+import './packages/col/col.scss';
+import Row from './packages/row/index.js';
+import './packages/row/row.scss';
+import Steps from './packages/steps/index.js';
+import './packages/steps/steps.scss';
+import Button from './packages/button/index.js';
+import './packages/button/button.scss';
+import Badge from './packages/badge/index.js';
+import './packages/badge/badge.scss';
+import Rate from './packages/rate/index.js';
+import './packages/rate/rate.scss';
+import Swiper from './packages/swiper/index.js';
+import './packages/swiper/swiper.scss';
+import Menu from './packages/menu/index.js';
+import './packages/menu/menu.scss';
+import Stepper from './packages/stepper/index.js';
+import './packages/stepper/stepper.scss';
+import ButtonGroup from './packages/buttongroup/index.js';
+import './packages/buttongroup/buttongroup.scss';
+import SearchBar from './packages/searchbar/index.js';
+import './packages/searchbar/searchbar.scss';
+import ImagePicker from './packages/imagepicker/index.js';
+import './packages/imagepicker/imagepicker.scss';
+import Radio from './packages/radio/index.js';
+import './packages/radio/radio.scss';
+import RadioGroup from './packages/radiogroup/index.js';
+import './packages/radiogroup/radiogroup.scss';
+import CheckBox from './packages/checkbox/index.js';
+import './packages/checkbox/checkbox.scss';
+import CheckBoxGroup from './packages/checkboxgroup/index.js';
+import './packages/checkboxgroup/checkboxgroup.scss';
+import ShortPassword from './packages/shortpassword/index.js';
+import './packages/shortpassword/shortpassword.scss';
+import Skeleton from './packages/skeleton/index.js';
+import './packages/skeleton/skeleton.scss';
+import Scroller from './packages/scroller/index.js';
+import './packages/scroller/scroller.scss';
+import BackTop from './packages/backtop/index.js';
+import './packages/backtop/backtop.scss';
+import CountDown from './packages/countdown/index.js';
+import './packages/countdown/countdown.scss';
+import InfiniteLoading from './packages/infiniteloading/index.js';
+import './packages/infiniteloading/infiniteloading.scss';
+
+const packages = {
+    Cell,
+    Dialog,
+    Icon,
+    Toast,
+    ActionSheet,
+    Tab,
+    TabPanel,
+    TabBar,
+    Calendar,
+    DatePicker,
+    NavBar,
+    NoticeBar,
+    Switch,
+    Slider,
+    Range,
+    Picker,
+    Progress,
+    Price,
+    Flex,
+    Col,
+    Row,
+    Steps,
+    Button,
+    Badge,
+    Rate,
+    Swiper,
+    Menu,
+    Stepper,
+    ButtonGroup,
+    SearchBar,
+    ImagePicker,
+    Radio,
+    RadioGroup,
+    CheckBox,
+    CheckBoxGroup,
+    ShortPassword,
+    Skeleton,
+    Scroller,
+    BackTop,
+    CountDown,
+    InfiniteLoading,
+};
+
 const components = {};
 const methods = {};
 const filters = {};
@@ -70,7 +196,7 @@ if (typeof window !== 'undefined' && window.Vue) {
     install(window.Vue);
 }
 
-const API = {
+export default {
     version,
     locale,
     install,
@@ -78,6 +204,4 @@ const API = {
     ...filters,
     ...directives,
     ...methods
-};
-
-export default API; 
+};

+ 0 - 127
src/packages.js

@@ -1,127 +0,0 @@
-import Cell from './packages/cell/index.js';
-import './packages/cell/cell.scss';
-import Dialog from './packages/dialog/index.js';
-import './packages/dialog/dialog.scss';
-import Icon from './packages/icon/index.js';
-import './packages/icon/icon.scss';
-import Toast from './packages/toast/index.js';
-import './packages/toast/toast.scss';
-import ActionSheet from './packages/actionsheet/index.js';
-import './packages/actionsheet/actionsheet.scss';
-import Tab from './packages/tab/index.js';
-import './packages/tab/tab.scss';
-import TabPanel from './packages/tabpanel/index.js';
-import './packages/tabpanel/tabpanel.scss';
-import TabBar from './packages/tabbar/index.js';
-import './packages/tabbar/tabbar.scss';
-import Calendar from './packages/calendar/index.js';
-import './packages/calendar/calendar.scss';
-import DatePicker from './packages/datepicker/index.js';
-import './packages/datepicker/datepicker.scss';
-import NavBar from './packages/navbar/index.js';
-import './packages/navbar/navbar.scss';
-import NoticeBar from './packages/noticebar/index.js';
-import './packages/noticebar/noticebar.scss';
-import Switch from './packages/switch/index.js';
-import './packages/switch/switch.scss';
-import Slider from './packages/slider/index.js';
-import './packages/slider/slider.scss';
-import Range from './packages/range/index.js';
-import './packages/range/range.scss';
-import Picker from './packages/picker/index.js';
-import './packages/picker/picker.scss';
-import Progress from './packages/progress/index.js';
-import './packages/progress/progress.scss';
-import Price from './packages/price/index.js';
-import './packages/price/price.scss';
-import Flex from './packages/flex/index.js';
-import './packages/flex/flex.scss';
-import Col from './packages/col/index.js';
-import './packages/col/col.scss';
-import Row from './packages/row/index.js';
-import './packages/row/row.scss';
-import Steps from './packages/steps/index.js';
-import './packages/steps/steps.scss';
-import Button from './packages/button/index.js';
-import './packages/button/button.scss';
-import Badge from './packages/badge/index.js';
-import './packages/badge/badge.scss';
-import Rate from './packages/rate/index.js';
-import './packages/rate/rate.scss';
-import Swiper from './packages/swiper/index.js';
-import './packages/swiper/swiper.scss';
-import Menu from './packages/menu/index.js';
-import './packages/menu/menu.scss';
-import Stepper from './packages/stepper/index.js';
-import './packages/stepper/stepper.scss';
-import ButtonGroup from './packages/buttongroup/index.js';
-import './packages/buttongroup/buttongroup.scss';
-import SearchBar from './packages/searchbar/index.js';
-import './packages/searchbar/searchbar.scss';
-import ImagePicker from './packages/imagepicker/index.js';
-import './packages/imagepicker/imagepicker.scss';
-import Radio from './packages/radio/index.js';
-import './packages/radio/radio.scss';
-import RadioGroup from './packages/radiogroup/index.js';
-import './packages/radiogroup/radiogroup.scss';
-import CheckBox from './packages/checkbox/index.js';
-import './packages/checkbox/checkbox.scss';
-import CheckBoxGroup from './packages/checkboxgroup/index.js';
-import './packages/checkboxgroup/checkboxgroup.scss';
-import ShortPassword from './packages/shortpassword/index.js';
-import './packages/shortpassword/shortpassword.scss';
-import Skeleton from './packages/skeleton/index.js';
-import './packages/skeleton/skeleton.scss';
-import Scroller from './packages/scroller/index.js';
-import './packages/scroller/scroller.scss';
-import BackTop from './packages/backtop/index.js';
-import './packages/backtop/backtop.scss';
-import CountDown from './packages/countdown/index.js';
-import './packages/countdown/countdown.scss';
-import InfiniteLoading from './packages/infiniteloading/index.js';
-import './packages/infiniteloading/infiniteloading.scss';
-
-
-export default {
-    Cell,
-    Dialog,
-    Icon,
-    Toast,
-    ActionSheet,
-    Tab,
-    TabPanel,
-    TabBar,
-    Calendar,
-    DatePicker,
-    NavBar,
-    NoticeBar,
-    Switch,
-    Slider,
-    Range,
-    Picker,
-    Progress,
-    Price,
-    Flex,
-    Col,
-    Row,
-    Steps,
-    Button,
-    Badge,
-    Rate,
-    Swiper,
-    Menu,
-    Stepper,
-    ButtonGroup,
-    SearchBar,
-    ImagePicker,
-    Radio,
-    RadioGroup,
-    CheckBox,
-    CheckBoxGroup,
-    ShortPassword,
-    Skeleton,
-    Scroller,
-    BackTop,
-    CountDown,
-    InfiniteLoading,
-}

+ 6 - 7
src/packages/dialog/dialog.vue

@@ -195,7 +195,7 @@ export default {
       }
     },
     cancelBtnClick(autoClose) {
-      this.$emit("ok-btn-click");
+      this.$emit("cancel-btn-click");
       if (typeof this.onCancelBtn === "function") {
         if (this.onCancelBtn.call(this) === false) return;
       }
@@ -214,8 +214,7 @@ export default {
       if (this.link) location.href = this.link;
     }
   },
-  created() {
-  },
+  created() {},
   watch: {
     visible: {
       handler(val) {
@@ -224,10 +223,10 @@ export default {
       immediate: true
     },
     curVisible(val) {
-        if (this.lockBgScroll) {
-          //锁定or解锁页面滚动
-          lockMaskScroll[val?'afterOpen':'beforeClose']();
-        }
+      if (this.lockBgScroll) {
+        //锁定or解锁页面滚动
+        lockMaskScroll[val ? "afterOpen" : "beforeClose"]();
+      }
     }
   }
 };

+ 15 - 11
src/packages/switch/switch.vue

@@ -1,7 +1,11 @@
 <template>
-    <div class="nut-switch" :class="[{'nut-switch-active':isActive},'nut-switch-'+size,{'nut-switch-disabled':disabled}]" @click="toggle">
-      <div class="nut-switch-btn"></div>
-    </div>
+  <div
+    class="nut-switch"
+    :class="[{'nut-switch-active':isActive},'nut-switch-'+size,{'nut-switch-disabled':disabled}]"
+    @click="toggle"
+  >
+    <div class="nut-switch-btn"></div>
+  </div>
 </template>
 <script>
 export default {
@@ -13,11 +17,11 @@ export default {
     },
     size: {
       type: String,
-      default: 'base'
+      default: "base"
     },
-    disabled:{
-      type:Boolean,
-      default:false
+    disabled: {
+      type: Boolean,
+      default: false
     }
   },
   data() {
@@ -36,12 +40,12 @@ export default {
   methods: {
     toggle() {
       const status = this.isActive;
-      if(!this.disabled){
-          this.isActive = !status;
+      if (!this.disabled) {
+        this.isActive = !status;
       }
-      
+
       setTimeout(() => {
-        this.$emit('change',this.isActive);
+        this.$emit("change", this.isActive);
         this.$emit("update:active", this.isActive);
       }, 300);
     }