【MIP官方博客】MIP开发教程(二) 使用MIP-CLI工具调试MIP网页

seofangfa 其他杂项评论50阅读模式
摘要初始化mip配置新建一个MIP网页编写mip网页代码校验MIP网页调试MIP网页 1. 初始化mip配置 我们在html目录下进行初始化mip 配置:

1. 初始化mip配置

我们在html目录下进行初始化mip 配置:

$ mip init

【MIP官方博客】MIP开发教程(二) 使用MIP-CLI工具调试MIP网页-图片1

此时会创建mip.config文件: 【MIP官方博客】MIP开发教程(二) 使用MIP-CLI工具调试MIP网页-图片2

2. 新建一个MIP网页

在mip-project/html文件夹下输入如下命令:

$ mip add index.html

【MIP官方博客】MIP开发教程(二) 使用MIP-CLI工具调试MIP网页-图片3

成功添加后,本地文件夹中会出现index.html 文件,这就是一个基础的MIP页面

【MIP官方博客】MIP开发教程(二) 使用MIP-CLI工具调试MIP网页-图片4

【MIP官方博客】MIP开发教程(二) 使用MIP-CLI工具调试MIP网页-图片5

在新建网页的时候可以添加需要载入的mip组件js脚本,例如:

$ mip add index.html mip-share

【MIP官方博客】MIP开发教程(二) 使用MIP-CLI工具调试MIP网页-图片6

将在index.html中载入mip-share组件的js脚本

【MIP官方博客】MIP开发教程(二) 使用MIP-CLI工具调试MIP网页-图片7

3. 编写mip网页代码

MIP页面新手指南可参见官网文档-新手指南。在编写mip代码的时候需要注意符合mip网页规范,否则通不过mip校验程序,mip校验规则地址:https://www.mipengine.org/doc/2-tech/2-validate-mip.html。

4. 校验MIP网页

$ mip validate index.html

出现ERROR的条目通不过mip校验,需要进行修改。

例如:

【MIP官方博客】MIP开发教程(二) 使用MIP-CLI工具调试MIP网页-图片8

注意:
mip页面应该为utf-8编码,其他编码格式通不过校验,如果需要使用其他编码格式,可以使用线上校验器粘贴代码进行校验,
线上校验器地址: https://www.mipengine.org/validator/validate。

5. 调试MIP网页

进入到html项目目录,启动mip server

$ mip server

【MIP官方博客】MIP开发教程(二) 使用MIP-CLI工具调试MIP网页-图片9

访问http://127.0.01:8000进入调试页面:

【MIP官方博客】MIP开发教程(二) 使用MIP-CLI工具调试MIP网页-图片10

注意:

mip server默认监听8000和35730端口,如果有端口冲突可以在mip.config中修改启动端口。

也可以使用mip server -f命令强制关闭当前占用端口的node进程(windows下无效)。

本系列共有四篇文章:

文章末尾固定信息

weinxin
我的微信
我的微信
微信扫一扫
 
seofangfa
  • 本文由 seofangfa 发表于 2017年4月24日12:09:06
  • 转载请务必保留本文链接:https://wp.fangfa.me/other-note/mip-jiaocheg2.html
匿名

发表评论

匿名网友
:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:
确定

拖动滑块以完成验证