插件amd化

README.md

@@ -9,7 +9,7 @@ Install excel-preview and dependencies
 npm install excel-preview --save
 ```
 
-Include jquery and table2excel in your page
+Include jquery and excel-preview in your page
 ------------------------------------------
 ```html
 <script src="node_modules/jquery/dist/jquery.min.js" type="text/javascript"></script>
@@ -30,12 +30,33 @@ Using the plugin
 ```html
 <input type="file" name="file">
 <div id="yourExcelTable"></div>
+<div id="kartik-file-errors"></div> /** error message*/
 ```
 
 ```javascript
 $("#yourExcelTable").excelPreview({});
 ```
 
+Using the plugin in webpack
+===========================
+you should include these codes in your entry.
+```
+    import '../node_modules/bootstrap/dist/js/bootstrap.min';
+    import 'bootstrap-table';
+    import 'bootstrap-fileinput';
+    import '../node_modules/excel-preview/js/dist/excel-preview.min';
+```
+include below codes in webpack.config
+```
+
+        new webpack.ProvidePlugin({
+            '$': 'jquery',
+            'jQuery': 'jquery',
+            'window.jQuery': 'jquery'
+        })
+```
+
+
 [index.html](https://github.com/sumile-ting/excel-preview/blob/master/index.html)
 
 Contains a simple HTML file to demonstrate the plugin.

js/src/excel-preview.js

@@ -1,27 +1,34 @@
-//excelPreview.js
-;(function ( $, window, document, undefined ) {
+!function (root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        define(['jquery'], factory);
+    } else {
+        factory(root.jQuery);
+    }
+}(this, function ($) {
+    'use strict';
+
+    // Default options
     var pluginName = "excelPreview",
 
-    defaults = {
-        height: 500
-    };
+        defaults = {
+            height: 500
+        };
 
-    // The actual plugin constructor
-    function Plugin ( element, options ) {
-            this.element = element;
-            // jQuery has an extend method which merges the contents of two or
-            // more objects, storing the result in the first object. The first object
-            // is generally empty as we don't want to alter the default options for
-            // future instances of the plugin
-            //
-            this.settings = $.extend( {}, defaults, options );
-            this._defaults = defaults;
-            this._name = pluginName;
-            defaults = this.settings;
-            this.init();
-    }
+    // Constructor, initialise everything you need here
+    var Plugin = function (element, options) {
+        this.element = element;
+        this.settings = $.extend({}, defaults, options);
+        this._defaults = defaults;
+        this._name = pluginName;
+        defaults = this.settings;
+        this.init();
+    };
 
+    // Plugin methods and shared properties
     Plugin.prototype = {
+        // Reset constructor - http://goo.gl/EcWdiy
+        constructor: Plugin,
+
         init: function () {
             var e = this;
             $(e.element).prev('input[type=file]').fileinput({
@@ -33,18 +40,18 @@
                 allowedFileExtensions: ['xlsx'],
                 elErrorContainer: '#kartik-file-errors',
                 // showRemove: false
-            }).on('change', function(file) {
+            }).on('change', function (file) {
                 e.excelPreview(file);
-            })  
+            })
         },
-
         excelPreview: function (file) {
             var e = this;
             loadFile(file, e.element);
             $(e.element).prev('input[type=file]').fileinput('refresh');
             return true;
         }
-    };
+    }
+
 
     function loadFile(event, ele) {
         let file = event.target.files;
@@ -131,9 +138,9 @@
         let rowspan = Math.abs(merge.e.r - merge.s.r + 1);
         let colspan = Math.abs(merge.e.c - merge.s.c + 1);
         $table.bootstrapTable('mergeCells', {
-            index: merge.s.r, 
+            index: merge.s.r,
             field: 'column_' + merge.s.c,
-            rowspan: rowspan, 
+            rowspan: rowspan,
             colspan: colspan
         });
     }
@@ -148,9 +155,9 @@
 
     /**
      * key = AA2, start: A1, end = AA8, return {r: 1, c: 26}
-     * @param {*} key 
-     * @param {*} start 
-     * @param {*} end 
+     * @param {*} key
+     * @param {*} start
+     * @param {*} end
      */
     function getRowColIndex(key, start) {
         start = CUSTOM_UTIL.splitRC(start);
@@ -217,17 +224,27 @@
         loadTabContent(sheetName, workbook, $table.find('table'));
     }
 
-
-    $.fn[ pluginName ] = function ( options ) {
-        var e = this;
-            e.each(function() {
-                if ( !$.data( e, "plugin_" + pluginName ) ) {
-                    $.data( e, "plugin_" + pluginName, new Plugin( this, options ) );
+    // Create the jQuery plugin
+    $.fn[ pluginName ] = function (options) {
+        // Do a deep copy of the options - http://goo.gl/gOSSrg
+        options = $.extend(true, {}, defaults, options);
+
+        return this.each(function () {
+            var $this = $(this);
+            // Create a new instance for each element in the matched jQuery set
+            // Also save the instance so it can be accessed later to use methods/properties etc
+            // e.g.
+            //    var instance = $('.element').data('plugin');
+            //    instance.someMethod();
+
+            if ( !$.data( $this, "plugin_" + pluginName ) ) {
+                    $.data( $this, "plugin_" + pluginName, new Plugin( this, options ) );
                 }
-            });
-
-        // chain jQuery functions
-        return e;
+        });
     };
 
-})( jQuery, window, document );
+    // Expose defaults and Constructor (allowing overriding of prototype methods for example)
+    $.fn[ pluginName ].defaults = defaults;
+    $.fn[ pluginName ].Plugin = Plugin;
+});
+

package.json

@@ -1,6 +1,6 @@
 {
   "name": "excel-preview",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "Preview Excel online",
   "main": "index.js",
   "scripts": {