[incubator-weex-site] branch master updated: Add Compiler target example (#496)

[ky...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

kyork pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-weex-site.git


The following commit(s) were added to refs/heads/master by this push:
     new 4a8339a  Add Compiler target example (#496)
4a8339a is described below

commit 4a8339aad7ea72c65b6ea47f69d44fe7737bdb4b
Author: Renmin <33...@users.noreply.github.com>
AuthorDate: Mon Sep 16 11:09:29 2019 +0800

    Add Compiler target example (#496)
---
 docs/guide/use-vue-in-weex.md    | 51 +++++++++++++++++++++++++++++++++++++++
 docs/zh/guide/use-vue-in-weex.md | 52 ++++++++++++++++++++++++++++++++++++++++
 2 files changed, 103 insertions(+)

diff --git a/docs/guide/use-vue-in-weex.md b/docs/guide/use-vue-in-weex.md
index 1d9d18c..33c45de 100644
--- a/docs/guide/use-vue-in-weex.md
+++ b/docs/guide/use-vue-in-weex.md
@@ -118,6 +118,57 @@ const webpackConfig = {
 Always use javascript file as the entry file.
 :::
 
+**Example of using weex-loader compile targets**
+1. execute `npm init` in terminal
+2. update `package.json`，add belows content into it
+```
+  "dependencies": {
+    "babel-loader": "^8.0.6",
+    "weex-loader": "^0.7.12",
+    "webpack": "^2.2.1"
+  },
+  "scripts": {
+    "build": "webpack --config webpack.config.js"
+  },
+```
+3. create `webpack.config.js`,modify `<your-input-file>` and `<your-output-file>`
+```
+const webpack = require('webpack');
+const path = require('path');
+module.exports = {
+  entry: '<your-input-file>',
+  output: {
+    path: path.resolve(__dirname, './'),
+    filename: <your-output-file>
+  },
+  module: {
+	    rules: [
+	      {
+	        test: /\.vue(\?[^?]+)?$/,
+	        loaders: ['weex-loader']
+	      },
+	      {
+	        test: /\.js$/,
+	        loaders: ['babel-loader']
+	      }
+	    ]
+	  },
+	plugins: [
+		new webpack.BannerPlugin({
+			raw: true ,
+			banner: '// { "framework": "Vue" }\n'
+		})
+	]
+}
+```
+4. execute `npm run build` in terminal
+5. Done 
+
+**Example of using weex-toolkit compile targets**
+1. install [weex-toolkit](https://weex.apache.org/tools/toolkit.html#system-components)：`npm install weex-toolkit -g`
+2. execute `weex compile [resource file] [product address]`
+3. Done
+
 ## Supported Features
 
 ### Global Config
diff --git a/docs/zh/guide/use-vue-in-weex.md b/docs/zh/guide/use-vue-in-weex.md
index d4703c0..fed2c3a 100644
--- a/docs/zh/guide/use-vue-in-weex.md
+++ b/docs/zh/guide/use-vue-in-weex.md
@@ -118,6 +118,58 @@ const webpackConfig = {
 无论什么情况下都使用 javascript 文件作为入口文件。
 :::
 
+**使用weex-loader单文件编译示例**
+1. 执行`npm init`
+2. 修改`package.json`文件，向其中添加：
+```
+  "dependencies": {
+    "babel-loader": "^8.0.6",
+    "weex-loader": "^0.7.12",
+    "webpack": "^2.2.1"
+  },
+  "scripts": {
+    "build": "webpack --config webpack.config.js"
+  },
+```
+3. 创建`webpack.config.js`,按照你的需要更改。
+```
+const webpack = require('webpack');
+const path = require('path');
+
+module.exports = {
+  entry: '<your-input-file>',
+  output: {
+    path: path.resolve(__dirname, './'),
+    filename: <your-output-file>
+  },
+  module: {
+	    rules: [
+	      {
+	        test: /\.vue(\?[^?]+)?$/,
+	        loaders: ['weex-loader']
+	      },
+	      {
+	        test: /\.js$/,
+	        loaders: ['babel-loader']
+	      }
+	    ]
+	  },
+	plugins: [
+		new webpack.BannerPlugin({
+			raw: true ,
+			banner: '// { "framework": "Vue" }\n'
+		})
+	]
+}
+```
+4. 执行`npm run build`。
+5. 完成。
+
+**使用weex compile编译**
+1. 安装[weex-toolkit](https://weex.apache.org/zh/tools/toolkit.html#安装)：`npm install weex-toolkit -g`
+2. 执行`weex compile [资源文件] [产物地址]`命令
+3. 完成。
+
 ## 支持的功能
 
 ### 全局配置