第一步：裝置node.js（鏈接https://nodejs.org/en/）

裝置完成后在敕令行輸入node -v，顯現版本號即裝置勝利，如下圖

第二步：裝置 @tarojs/cli

在敕令行輸入npm install -g @tarojs/cli或yarn global add @tarojs/cli
在這裏我用的是cnpm install -g @tarojs/cli，謝謝阿里供應的國內鏡像
裝置完成后入下圖所示

輸入taro -V,，會顯現當前裝置的taro版本，如下圖

第三步：運用敕令建立模板項目

翻開目的文件夾后輸入敕令taro init myApp（myApp為項目名稱，由用戶指定）
然後會提醒輸入項目引見以及挑選項目模板，如下圖

建立完模板後會自動實行npm install裝置項目所需的依靠包，如下圖

守候依靠完成后就能夠最先謄寫你的代碼啦~~~

第四步：項目構建

項目初始化完成后就能夠在page目錄下編寫你本身的代碼了，下面以一個todo list為例

index.js

{

import Taro, { Component } from '@tarojs/taro'
import { View, text, Input } from '@tarojs/components'
import './index.scss'

export default class Index extends Component {
  config = {
    navigationBarTitleText: '首頁'
  }

  constructor() {
    super()
    this.state = {
      list: [
        'get up',
        'write',
        'sleep',
      ],
      inputVal: ''
    }
  }

  componentWillMount () { }

  componentDidMount () { }

  componentWillUnmout () { }

  componentDidShow () { }

  componentDidHide () { }

  addItem() {
    let { list, inputVal } = this.state
    if(inputVal == '') return
    else{
      list.push(inputVal)
    }
    this.setState({
      list,
      inputVal: ''
    })
  }

  delItem(index) {
    let { list } = this.state
    list.splice(index, 1)
    this.setState({
      list
    })
  }

  inputHandler(e) {
    this.setState({
      inputVal: e.target.value
    })
  }

  render () {
    let { list, inputVal } = this.state

    return (
      <View className='index'>
        <Input className='input' type='text' value={inputVal} onInput={this.inputHandler.bind(this)} />
        <text className='add' onClick={this.addItem.bind(this)}>增加</text>
        <View>
          <text>Todo list</text>
          {
            list && list.map((item, index) => {
              return <View>
                <text>{index + 1}.{item}</text>
                <text className='del' onClick={this.delItem.bind(this, index)}>刪除</text>
              </View>
            })
          }
        </View>
      </View>
    )
  }
}

}

假如要構建成h5代碼，只需要輸入taro build –type h5 –watch即可將代碼編譯成h5版本，即可在http://localhost:8080/接見

假如要構建成小順序代碼，只需要輸入taro build –type weapp –watch即可將代碼編譯成小順序版本，在微信開發者東西中挑選項目中的dist文件夾即可以預覽