update readme for 1.0 (QingWei-Li#19)

QingWei-Li · web-flow · commit a414b7413a25 · 2017-05-24T15:54:37.000+08:00
diff --git a/README.md b/README.md
@@ -2,10 +2,9 @@
 
 > Convert Markdown file to Vue Component using markdown-it.
 
-**Supports both Vue 1.x and 2.0**
-
 ## Example
-https://github.com/mint-ui/docs
+- https://github.com/mint-ui/docs
+- https://github.com/elemefe/element
 
 ## Demo
 
@@ -14,6 +13,10 @@ https://github.com/mint-ui/docs
 ## Installation
 
 ```bash
+# For Vue1
+npm i vue-markdown-loader@0 -D
+
+# For Vue2
 npm i vue-markdown-loader -D
 ```
 
@@ -24,17 +27,19 @@ npm i vue-markdown-loader -D
 
 
 ## Usage
-[Documentation: Using loaders](http://webpack.github.io/docs/using-loaders.html)
+[Documentation: Using loaders](https://webpack.js.org/concepts/loaders/)
 
 `webpack.config.js` file:
 
 ```javascript
 module.exports = {
   module: {
-    loaders: [{
-      test: /\.md/,
-      loader: 'vue-markdown-loader'
-    }]
+    rules: [
+      {
+        test: /\.md$/,
+        loader: 'vue-markdown-loader'
+      }
+    ]
   }
 };
 ```
@@ -44,23 +49,27 @@ module.exports = {
 reference [markdown-it](https://github.com/markdown-it/markdown-it#init-with-presets-and-options)
 ```javascript
 {
-  vueMarkdown: {
-    // markdown-it config
-    preset: 'default',
-    breaks: true,
-
-    preprocess: function(markdownIt, source) {
-      // do any thing
-
-      return source
-    },
-
-    use: [
-      /* markdown-it plugin */
-      require('markdown-it-xxx'),
-
-      /* or */
-      [require('markdown-it-xxx'), 'this is options']
+  module: {
+    rules: [
+      {
+        test: /\.md$/,
+        loader: 'vue-markdown-loader'
+        options: {
+          // markdown-it config
+          preset: 'default',
+          breaks: true,
+          preprocess: function(markdownIt, source) {
+            // do any thing
+            return source
+          },
+          use: [
+            /* markdown-it plugin */
+            require('markdown-it-xxx'),
+            /* or */
+            [require('markdown-it-xxx'), 'this is options']
+          ]
+        }
+      }
     ]
   }
 }
@@ -73,31 +82,6 @@ var markdown = require('markdown-it')({
   breaks: true
 })
 
-markdown
-  .use(plugin1)
-  .use(plugin2, opts, ...)
-  .use(plugin3);
-
-module.exports = {
-  module: {
-    loaders: [{
-      test: /\.md/,
-      loader: 'vue-markdown-loader'
-    }]
-  },
-
-  vueMarkdown: markdown
-};
-```
-
-webpack 2.x
-
-```javascript
-var markdown = require('markdown-it')({
-  html: true,
-  breaks: true
-})
-
 markdown
   .use(plugin1)
   .use(plugin2, opts, ...)
@@ -107,7 +91,7 @@ module.exports = {
   module: {
     rules: [
       {
-        test: /\.md/,
+        test: /\.md$/,
         loader: 'vue-markdown-loader',
         options: markdown
       }
@@ -116,8 +100,7 @@ module.exports = {
 };
 ```
 
-
-## Note
+## Notes for `0.x` version
 Resource references can only use **absolute path**
 
 e.g.
diff --git a/example/webpack.config.js b/example/webpack.config.js
@@ -1,54 +1,39 @@
-var path = require('path');
-var webpack = require('webpack');
+var resolve = require('path').resolve
+var webpack = require('webpack')
 
 module.exports = {
   entry: './src/entry.js',
   output: {
-    path: path.resolve(__dirname, './dist'),
+    path: resolve(__dirname, './dist'),
     publicPath: '/dist/',
     filename: 'build.js'
   },
-  resolveLoader: {
-    root: path.join(__dirname, '../node_modules'),
-  },
   module: {
-    loaders: [
+    rules: [
       {
         test: /\.vue$/,
-        loader: 'vue'
+        loader: 'vue-loader'
       },
       {
         test: /\.js$/,
-        loader: 'babel',
-        exclude: /node_modules/
+        loader: 'babel-loader',
+        exclude: /node_modules/,
+        options: {
+          presets: ['es2015']
+        }
       },
       {
         test: /\.css$/,
-        loader: 'style!css'
+        use: ['style-loader', 'css-loader']
       },
       {
         test: /\.md$/,
-        loader: path.resolve(__dirname, '../index.js')
-      },
-      {
-        test: /\.(eot|svg|ttf|woff|woff2)(\?\S*)?$/,
-        loader: 'file'
-      },
-      {
-        test: /\.(png|jpe?g|gif|svg)(\?\S*)?$/,
-        loader: 'file',
-        query: {
-          name: '[name].[ext]?[hash]'
-        }
+        loader: resolve(__dirname, '../index.js')
       }
     ]
   },
-  babel: {
-    presets: ['es2015']
-  },
   devServer: {
     historyApiFallback: true,
     noInfo: true
-  },
-  devtool: '#eval-source-map'
-};
+  }
+}
diff --git a/package.json b/package.json
@@ -29,7 +29,7 @@
     "markdown-it": "^6.0.5"
   },
   "peerDependencies": {
-    "vue-loader": ">=8.0.0"
+    "vue-loader": ">=10.0.0"
   },
   "devDependencies": {
     "babel-core": "^6.17.0",
@@ -39,8 +39,9 @@
     "github-markdown-css": "^2.3.0",
     "style-loader": "^0.13.1",
     "vue": "^2.0.3",
-    "vue-loader": "^9.7.0",
-    "webpack": "^1.13.2",
-    "webpack-dev-server": "^1.16.2"
+    "vue-loader": "^12.1.0",
+    "vue-template-compiler": "^2.3.3",
+    "webpack": "^2.6.0",
+    "webpack-dev-server": "^2.4.5"
   }
 }
diff --git a/yarn.lock b/yarn.lock
