autumn2016
autumn2016
  • 发布:2017-02-18 17:05
  • 更新:2024-06-20 17:49
  • 阅读:14952

使用Vue单文件,开发Html5+应用

分类:HBuilder
Vue

vue-template-for-hbuilder

使用Vue单文件,开发Html5+应用

说明:

该模板生成自 vue-cli,对其dev模式进行了修改,用来使用hbuilder的开发

项目背景,自己之前开发了一个 app,使用的mui,后来引入了Vue,由于Hbuilder,还没编译es6的功能,及hbuilder有自己的web服务器,如果我们自己启动web服务的话,又不能将编译结果实时的推送到真机调试模式下,所以产生了修改vue项目模板的需求。

使用方法:

$ npm install -g vue-cli  
$ vue init aOrz/vue-template-for-hbuilder my-project  
$ cd my-project  
$ npm install  
$ npm run dev

使用Hbuilder打开my-project/dist中的目录,打开 manifest.json 点击云端获取,获取appid,并同步到 src/manifest.json 中,然后真机运行。
npm run dev 后代码会自动更新到 dist 目录,请不要用 Hbuilder 打开编译后的文件,以免影响真机测试

Build Setup

# install dependencies  
npm install  

# serve with hot reload at localhost:8080  
npm run dev  

# build for production with minification  
npm run build  

# build for production and view the bundle analyzer report  
npm run build --report
3 关注 分享
jwenlee edobnet Noah_liu

要回复文章请先登录注册

5***@qq.com

5***@qq.com

怎么改成多入口,请指教
2018-06-25 15:50
6***@qq.com

6***@qq.com

可以试下这个 https://github.com/tyaqing/mogo-h5plus
2018-06-07 17:25
7***@qq.com

7***@qq.com

把写好的vue项目代码复制到你的方法建的项目中,报这个错 Uncaught SyntaxError: Use of const in strict mode,怎么解决?
2018-05-30 16:09
1***@163.com

1***@163.com

我的为什么显示的是空白,求解
2017-09-13 21:36
pglin66

pglin66

手机调试空白 好像没有运行
2017-09-09 15:25
autumn2016

autumn2016 (作者)

回复 Noah_liu :
已经支持 vue-cli 安装,vue init aOrz/vue-template-for-hbuilder my-project 没必要提交到官方仓库
2017-08-26 21:05
Noah_liu

Noah_liu

为啥没有提交到官方的模板库呢
2017-07-07 15:27
autumn2016

autumn2016 (作者)

回复 2***@qq.com :
见文档
2017-04-02 14:10
2***@qq.com

2***@qq.com

还是不清楚怎么用
2017-03-31 18:18
autumn2016

autumn2016 (作者)

回复 shgga :
厉害了,赞
2017-03-04 11:32