Taro小程序多端框架常用api探索(3)

一、微信小程序预览

1、项目根目录下执行npm run build:weapp打包生成dist目录
2、微信开发者工具中新建项目打开dist文件夹，
同时执行npm run dev:weapp实时编译更新

从小程序预览切换至H5时，H5预览正常，但再次编译小程序时执行1，2中步骤，需要重新打开项目，不然总是报错。

二、H5端预览

1、项目根目录下执行npm run build:h5打包生成dist目录
2、将dist包上传到服务器
2.1 可通过nginx代理访问dist文件夹下目录，如：192.168.22.111/taroH5
2.2 通过本地的node+express搭建本地服务器

//1、新建空文件夹taroH5
//2、命令行进到该文件目录执行npm init创建package.json文件，同时新建index.js文件，将打包后的dist文件夹放到同目录下
//index.js
var express = require('express')
var app = express()
app.get('/taroH5',function(req,res){
  res.sendFile(__dirname + '/dist/index.html')
})
app.use(express.static('dist'))
app.listen(8000,function(){
  console.log('应用服务已经启动')
})

2.3浏览器地址栏打开localhost:8000/taroH5访问h5页面，手机和电脑连接同一局域网即可在手机上预览。