升级依赖 react 到 15 的版本。

修改 commonjs 到 es6

.eslintrc.json

@@ -1,7 +1,9 @@
 {
   "extends": "airbnb",
+  "parser": "babel-eslint",
   "plugins": [
-    "react"
+    "react",
+    "babel"
   ],
   "env": {
     "browser": true,

.gitignore

@@ -26,4 +26,6 @@ spm_modules
 .happypack
 dist
 build
+coverage
+package-lock.json
 assets/**/*.css

demo/index.jsx

@@ -1,6 +1,6 @@
-const ReactDOM = require('react-dom');
-const React = require('react');
-const Uploader = require('../src/');
+import ReactDOM from 'react-dom';
+import React from 'react';
+import Uploader from '../src/';
 // attachment file tips
 const tips = <span>请选择大小不超过5M的文本文件，支持doc,docx,xls,xlsx,zip格式</span>;
 const imgTips = <span>单张不超过3M，支持jpeg,jpg,png格式</span>;

package.json

@@ -1,57 +1,60 @@
 {
- "name": "uxcore-uploader",
- "version": "3.1.4",
- "description": "uxcore-uploader component for react",
- "main": "build/index.js",
- "scripts": {
-  "start": "uxcore-tools run start",
-  "server": "uxcore-tools run server",
-  "lint": "uxcore-tools run lint",
-  "build": "uxcore-tools run build",
-  "test": "uxcore-tools run test",
-  "coverage": "uxcore-tools run coverage",
-  "pub": "uxcore-tools run pub",
-  "dep": "uxcore-tools run dep",
-  "tnpm-dep": "uxcore-tools run tnpm-dep",
-  "chrome": "uxcore-tools run chrome",
-  "browsers": "uxcore-tools run browsers",
-  "saucelabs": "uxcore-tools run saucelabs",
-  "update": "uxcore-tools run update",
-  "tnpm-update": "uxcore-tools run tnpm-update"
- },
- "repository": {
-  "type": "git",
-  "url": "[email protected]:uxcore/uxcore-uploader.git"
- },
- "bugs": {
-  "url": "http://github.com/uxcore/uxcore-uploader/issues"
- },
- "keywords": [
-  "react",
-  "react-component",
-  "react-uxcore-uploader",
-  "uxcore-uploader"
- ],
- "devDependencies": {
-  "console-polyfill": "^0.2.2",
-  "es5-shim": "^4.5.8",
-  "expect.js": "~0.3.1",
-  "kuma-base": "1.x",
-  "react": "0.14.x",
-  "react-addons-test-utils": "0.14.x",
-  "react-dom": "0.14.x",
-  "uxcore-kuma": "*",
-  "uxcore-tools": "0.2.x"
- },
- "dependencies": {
-  "object-assign": "^4.0.0",
-  "uploadcore": "~2.3.0",
-  "uxcore-button": "^0.4.11",
-  "uxcore-icon": "^0.1.1",
-  "uxcore-progress": "^1.1.0",
-  "uxcore-album": "latest"
- },
- "author": "onbing",
- "contributors": [],
- "license": "MIT"
+  "name": "uxcore-uploader",
+  "version": "3.1.4",
+  "description": "uxcore-uploader component for react",
+  "main": "build/index.js",
+  "scripts": {
+    "start": "uxcore-tools run start",
+    "server": "uxcore-tools run server",
+    "lint": "uxcore-tools run lint",
+    "build": "uxcore-tools run build",
+    "test": "uxcore-tools run test",
+    "coverage": "uxcore-tools run coverage",
+    "pub": "uxcore-tools run pub",
+    "dep": "uxcore-tools run dep",
+    "tnpm-dep": "uxcore-tools run tnpm-dep",
+    "chrome": "uxcore-tools run chrome",
+    "browsers": "uxcore-tools run browsers",
+    "saucelabs": "uxcore-tools run saucelabs",
+    "update": "uxcore-tools run update",
+    "tnpm-update": "uxcore-tools run tnpm-update"
+  },
+  "repository": {
+    "type": "git",
+    "url": "[email protected]:uxcore/uxcore-uploader.git"
+  },
+  "bugs": {
+    "url": "http://github.com/uxcore/uxcore-uploader/issues"
+  },
+  "keywords": [
+    "react",
+    "react-component",
+    "react-uxcore-uploader",
+    "uxcore-uploader"
+  ],
+  "devDependencies": {
+    "console-polyfill": "^0.2.2",
+    "enzyme": "^3.0.0",
+    "enzyme-adapter-react-15": "^1.0.0",
+    "es5-shim": "^4.5.8",
+    "expect.js": "~0.3.1",
+    "kuma-base": "1.x",
+    "react": "15.x",
+    "react-dom": "15.x",
+    "react-test-renderer": "15.x",
+    "uxcore-kuma": "*",
+    "uxcore-tools": "0.2.x"
+  },
+  "dependencies": {
+    "object-assign": "^4.0.0",
+    "prop-types": "15.x",
+    "uploadcore": "~2.3.0",
+    "uxcore-album": "latest",
+    "uxcore-button": "^0.4.11",
+    "uxcore-icon": "^0.1.1",
+    "uxcore-progress": "^1.1.0"
+  },
+  "author": "onbing",
+  "contributors": [],
+  "license": "MIT"
 }

src/DefaultFileItem.js

@@ -1,9 +1,9 @@
-const React = require('react');
-const util = require('./util');
-const i18n = require('./locale');
-const Icon = require('uxcore-icon');
+import React from 'react';
+import util from './util';
+import i18n from './locale';
+import Icon from 'uxcore-icon';
 
-class DefaultFileItem extends React.Component {
+export default class DefaultFileItem extends React.Component {
 
   onCancel(file) {
     const me = this;
@@ -110,5 +110,3 @@ class DefaultFileItem extends React.Component {
     }
   }
 }
-
-module.exports = DefaultFileItem;

src/Dropzoom.js

@@ -1,11 +1,13 @@
-const React = require('react');
-const ReactDOM = require('react-dom');
-const {Events} = require('uploadcore');
-const util = require("./util");
-const FileList = require("./FileList");
-const Picker = require("./Picker");
+import React from 'react';
+import ReactDOM from 'react-dom';
+import {Events} from 'uploadcore';
+import util from "./util";
+import FileList from "./FileList";
+import Picker from "./Picker";
+
+export default class Dropzoom extends React.Component {
+    static displayName = "Dropzoom";
 
-class Dropzoom extends React.Component {
     constructor(props) {
         super(props);
 
@@ -79,6 +81,3 @@ class Dropzoom extends React.Component {
         </div>;
     }
 }
-
-Dropzoom.displayName = "Dropzoom";
-module.exports = Dropzoom;

src/FileItem.js

@@ -1,14 +1,15 @@
-const Preview = require('./Preview');
-const Progress = require('./Progress');
-const util = require('./util');
-const {Events} = require('uploadcore');
-const React = require('react');
-const ReactDOM = require('react-dom');
-const i18n = require('./locale');
-const Icon = require('uxcore-icon');
-
-class FileItem extends React.Component {
-
+import  Preview from './Preview';
+import  Progress from './Progress';
+import  util from './util';
+import  {Events} from 'uploadcore';
+import  React from 'react';
+import  i18n from './locale';
+import  Icon from 'uxcore-icon';
+
+export default class FileItem extends React.Component {
+    static defaultProps = {
+        mode: 'mini'
+    };
     constructor(props) {
         super(props);
 
@@ -176,8 +177,5 @@ class FileItem extends React.Component {
     }
 }
 
-FileItem.defaultProps = {
-    mode: 'mini'
-};
 
-module.exports = FileItem;
+

src/FileList.js

@@ -1,14 +1,28 @@
-const FileItem = require('./FileItem');
-const DefaultFileItem = require('./DefaultFileItem');
-const Picker = require('./Picker');
-const util = require('./util');
-const { Events, Status } = require('uploadcore');
-const React = require('react');
-const Album = require('uxcore-album');
+import FileItem from './FileItem';
+import DefaultFileItem from './DefaultFileItem';
+import Picker from './Picker';
+import util from './util';
+import { Events, Status } from 'uploadcore';
+import React from 'react';
+import PropTypes from "prop-types";
+import Album from 'uxcore-album';
 
 const { Photo } = Album;
 
-class FileList extends React.Component {
+export default class FileList extends React.Component {
+    static defaultProps = {
+        mode: 'mini',
+    };
+
+    static propTypes = {
+        locale: PropTypes.string,
+        mode: PropTypes.string,
+        isVisual: PropTypes.bool,
+        isOnlyImg: PropTypes.bool,
+        readOnly: PropTypes.bool,
+        fileList: PropTypes.array,
+        core: PropTypes.any,
+    };
   constructor(props) {
     super(props);
 
@@ -115,18 +129,3 @@ class FileList extends React.Component {
   }
 }
 
-FileList.defaultProps = {
-  mode: 'mini',
-};
-
-FileList.propTypes = {
-  locale: React.PropTypes.string,
-  mode: React.PropTypes.string,
-  isVisual: React.PropTypes.bool,
-  isOnlyImg: React.PropTypes.bool,
-  readOnly: React.PropTypes.bool,
-  fileList: React.PropTypes.array,
-  core: React.PropTypes.any,
-};
-
-module.exports = FileList;

src/Picker.js

@@ -1,8 +1,8 @@
-const React = require('react');
-const ReactDOM = require('react-dom');
-const Icon = require('uxcore-icon');
+import React from 'react';
+import ReactDOM from 'react-dom';
+import Icon from 'uxcore-icon';
 
-class Picker extends React.Component {
+export default class Picker extends React.Component {
   componentDidMount() {
     this.area = this.props.core.getPickerCollector().addArea(ReactDOM.findDOMNode(this));
   }
@@ -23,4 +23,3 @@ class Picker extends React.Component {
   }
 }
 
-module.exports = Picker;

src/Preview.js

@@ -1,7 +1,6 @@
-const React = require('react');
-const ReactDOM = require('react-dom');
+import React from 'react';
 
-class Preview extends React.Component {
+export default class Preview extends React.Component {
     constructor(props) {
         super(props);
 
@@ -19,5 +18,3 @@ class Preview extends React.Component {
             : <i className="kuma-upload-fileicon" data-ext={this.props.file.ext} data-type={this.props.file.type}/>}</div>;
     }
 }
-
-module.exports = Preview;

src/Progress.js

@@ -1,12 +1,19 @@
-const React = require('react');
-const ReactDOM = require('react-dom');
-const util = require('./util');
-const UxcoreProgress = require('uxcore-progress');
+import React from 'react';
+import PropTypes from 'prop-types';
+import UxcoreProgress from 'uxcore-progress';
 const { Line } = UxcoreProgress;
-const Icon = require('uxcore-icon');
-const {Events} = require('uploadcore');
+import Icon from 'uxcore-icon';
+import {Events} from 'uploadcore';
 
-class Progress extends React.Component {
+export default class Progress extends React.Component {
+    static propTypes = {
+        percentage: PropTypes.number,
+        interval: PropTypes.number
+    };
+    static defaultProps = {
+        percentage: 0,
+        interval: 100
+    };
     constructor(props) {
         super(props);
         this.state = {
@@ -88,13 +95,4 @@ class Progress extends React.Component {
     }
 }
 
-Progress.propTypes = {
-    percentage: React.PropTypes.number,
-    interval: React.PropTypes.number
-};
-Progress.defaultProps = {
-    percentage: 0,
-    interval: 100
-};
 
-module.exports = Progress;