快速开始

本地开发

# 克隆项目
git clone https://github.com/lzuntalented/lz-h5-edit.git

# 在项目目录下执行

# 首先安装lerna
npm i lerna -g
# 安装依赖
npm run install
# 构建包(要发布到npm上的包[packags.json中private不为true的],每次修改完都需要执行此命令,以供其他包引用最新的内容)
npm run build

# 本地调试
npm start
# 浏览网站
http://localhost:9901/client.html
# 调试核心编辑器
http://localhost:9901/design.html
# 调试作品
http://localhost:9901/opus.html?id=作品编号

// 构建
npm run webpack

本地调试端口在 webpack.config.js 43行修改

启动调试会生成三个入口:
1.http://localhost:9901/design.html 核心编辑器入口
2.http://localhost:9901/client.html 示例网站入口
3.http://localhost:9901/opus.html?id=作品id 作品入口(手机端访问,localhost改成对应的局域网ip)

线上部署

# 克隆项目
git clone https://github.com/lzuntalented/lz-h5-edit.git
# 在项目目录下执行
cnpm install
# 启动构建
npm run webpack

构建后文件存放在dist文件夹下,将dist文件夹下的文件拷贝到你的web服务器上即可访问

  • 构建结果同样的会生成两个入口:
    • 主站编辑器入口,访问路径:http://你的域名/
    • 作品访问入口,访问路径:http://你的域名/wap.html?id=作品id
  • 注意事项
    • 使用域名根目录访问,不然可能导致路径不存在的问题
    • 为保持线上访问一直是最新的构建文件,在构建时引入本地版本号的概念,即:在dist目录下会生成0.0.1/0.0.2/0.0.3这样的文件夹,每次构建这个版本号会自动递增,请勿删除项目下的版本号文件夹,防止版本号计算错误。
    • 生成入口的html模板在src\tpl目录下,请在部署时修改html模板中的百度统计脚本,使用你自己的统计脚本。