# <span id="deployment">部署</span>
wx-chart可以被部署在純瀏覽器環境，以及微信小程序環境中。其本身是基于ES6規范編寫，因此尤其適合ES6/ES7開發環境
## <span id="es6">ES6/ES7環境</span>
```js
import { WxDoughnut, WxLiner, WxBar } from 'wx-chart';
let options = {...};
var myChart = new WxLiner('myCanvas', options);
```
如果你沒有使用npm或bower安裝，則可能需要自行配置入口。默認的工程入口指向為 `src/wx-chart.js` 。
## <span id="wx">微信小程序環境</span>
當前微信小程序不支持從npm等包管理器下載js庫，因此你需要手動拷貝 `dist/wx-chart.min.js` 到你的程序工程中，而后手動引用。
```js
let WxChart = require("you/path/wx-chart.min.js");
// 初始化
let options = {...};
let myChart = new WxChart.WxLiner('myCanvas', options);
```
## <span id="react">React環境</span>
wx-chart需要配合[wx-chart-react插件](https://github.com/xch89820/wx-chart-react)以便支持React環境，詳細獲取方式詳見[獲取](gettingstarted/download.md)章節。
需要注意的是，React環境的組件名稱為 `圖表類名+React`, 例如 `WxLiner` 其React組件名稱為 `WxLinerReact`
以下為ES6/ES7環境下jsx事例代碼：
```js
import React from 'react';
import ReactDOM from 'react-dom';
import WxLinerReact from 'wx-chart-react';
// 初始化
let options = {...};
const myChart = ReactDOM.render(<WxLinerReact {...options}></WxLinerReact>, 'myCanvas');
```
## <span id="script">script標簽</span>
您如果沒有使用工程化的js環境，您需要手動拷貝 `dist/wx-chart.min.js` 至您的工程，并使用script標簽引用。引用后使用全局變量入口為 `WxChart`。
```html
<script src="/path/to/wx-chart.min.js"></script>
<script>
var myChart = new WxChart.WxLiner('myCanvas', {...});
//...
</script>
```
## <span id="commonjs">Common JS</span>
```js
var WxChart= require('wx-chart');
var myChart = new WxChart.WxLiner('myCanvas', {...});
```
## <span id="requirejs">Require JS</span>
```js
require(['path/to/wx-chart.min.js'], function(WxChart){
var myChart = new WxChart.WxLiner('myCanvas', {...});
});
```
