update new version and fix crop resize bug

Author: JackPu

index.js

@@ -1,8 +1,8 @@
 {
   "name": "vue-core-image-upload",
-  "version": "2.1.7",
+  "version": "2.1.10",
   "description": "a vue plgin for image upload and crop",
-  "main": "src/index.js",
+  "main": "dist/index.js",
   "dependencies": {
     "vue": "^2.0.5"
   },
@@ -15,6 +15,7 @@
     "babel-preset-es2015": "^6.14.0",
     "babel-preset-stage-2": "^6.13.0",
     "babel-runtime": "^6.11.6",
+    "copy-webpack-plugin": "^4.0.1",
     "css-loader": "^0.25.0",
     "eslint": "^3.14.0",
     "eslint-config-airbnb": "^14.0.0",

package.json

@@ -1,15 +1,9 @@
 'use strict'
-const pkg = require('../package')
 
 module.exports = {
   port: 4000,
-  title: 'site',
+  title: 'vue-core-image-upload a vue plugin for image to crop and upload. (一款轻量级vue.js图片上传裁剪插件)',
   // when you use electron please set to relative path like ./
   // otherwise only set to absolute path when you're using history mode
-  publicPath: '/',
-  // disable babelrc by default
-  babel: {
-    babelrc: false,
-    presets: ['vue-app','es2015','stage-2'],
-  }
+  publicPath: '/'
 }

site/build/config.js

@@ -32,27 +32,18 @@ module.exports = {
     ]
   },
   module: {
-    loaders: [
+    rules: [
       {
         test: /\.vue$/,
-        loaders: ['vue-loader']
+        use: 'vue-loader',
       },
       {
         test: /\.js$/,
-        loaders: ['babel-loader'],
-        exclude: /node_modules/
+        use: {
+          loader: 'babel-loader'
+        },
+         exclude: /node_modules/
       },
-      {
-        test: /\.(ico|jpg|png|gif|eot|otf|webp|ttf|woff|woff2)(\?.*)?$/,
-        loader: 'file-loader',
-        query: {
-          name: 'static/media/[name].[hash:8].[ext]'
-        }
-      },
-      {
-        test: /\.svg$/,
-        loader: 'raw-loader'
-      }
     ]
   },
   plugins: [

site/build/webpack.base.js

@@ -24,12 +24,11 @@ _.cssProcessors.forEach(processor => {
   } else {
     loaders = ['postcss-loader', processor.loader]
   }
-  base.module.loaders.push(
+  base.module.rules.push(
     {
       test: processor.test,
       loaders: ['style-loader', _.cssLoader].concat(loaders)
     }
   )
 })
-
 module.exports = base

site/build/webpack.dev.js

@@ -68,7 +68,7 @@ _.cssProcessors.forEach(processor => {
   } else {
     loaders = ['postcss-loader', processor.loader]
   }
-  base.module.loaders.push({
+  base.module.rules.push({
     test: processor.test,
     loader: ExtractTextPlugin.extract({
       use: [_.cssLoader].concat(loaders),
@@ -88,5 +88,5 @@ base.stats = {
   chunkOrigins: false,
   modules: false
 }
-
+console.log(base.module.rules[4]);
 module.exports = base

site/build/webpack.prod.js

@@ -5,7 +5,7 @@
     <div class="center">
       <p><img width="300" :src="src" /></p>
       <vue-core-image-upload
-        :class="['btn', 'btn-primary']"
+        class="btn btn-primary"
         @imageuploaded="imageUploded"
         :max-file-size="5242880"
         compress="50"

site/client/components/doc/cn/CompressImage.vue

@@ -13,7 +13,7 @@
       </div>
       <vue-core-image-upload
          crop-ratio="1:1"
-         :class="['btn', 'btn-primary']"
+         class="btn btn-primary"
          crop="local"
          url="http://101.198.151.190/api/upload.php"
          extensions="png,jpeg,jpg"
@@ -43,7 +43,7 @@
       </div>
       <vue-core-image-upload
          crop-ratio="1:1"
-         :class="['btn', 'btn-primary']"
+         class="btn btn-primary"
          crop="server"
          url="http://101.198.151.190/api/crop.php"
          extensions="png,gif,jpeg,jpg"

site/client/components/doc/cn/CropImage.vue

@@ -16,7 +16,7 @@
     </div>
     <div class="center">
       <vue-core-image-upload
-        :class="['btn', 'btn-primary']"
+        class="btn btn-primary"
         :crop="false"
         @imagechanged="imagechanged"
         @imageuploading="imageuploading"

site/client/components/doc/cn/Events.vue

@@ -7,7 +7,7 @@
     <pre v-highlightjs><code class="javascript">&lt;template&gt;
 &lt;div class="center"&gt;
   &lt;vue-core-image-upload
-    :class="['btn', 'btn-primary']"
+    class="btn btn-primary"
     :crop="false"
     @imageuploaded="imageuploaded"
     :data="data"
@@ -45,7 +45,7 @@ export default {
    </p>
    <div class="center">
      <vue-core-image-upload
-       :class="['btn', 'btn-primary']"
+       class="btn btn-primary"
        :crop="false"
        @imageuploaded="imageuploaded"
        :data="data"