HBuilder打包
HBuilder打包 是将前端开发的HTML/CSS/JS文件进行打包,打包成可以直接安装在手机上面的App,不借助浏览器就可以直接运行
1. 使用webpack将项目进行打包,打包好的文件会在dist目录
webpack -p
2. 打开Hbuilder,新建移动App项目,然后删掉css/js/imgs文件夹和index.html文件
3. 将使用webpack打包的dist目录里面的文件全部拷贝到新建的移动项目目录中
4. 选中HTML文件,点击HBuilder导航上面的`发行`-`打原生安装包`,直接下一步,选安卓公共证书-`打包`
5. 在项目的`unpackage\release`中可以得到打包完毕的apk文件cordova打包
直接在本地进行打包
需要电脑配置Java环境和Android环境 (配置方式参考react native课程第一天)
// 1. 安装全局cordova
npm i cordova -g
// 2. 创建cordova项目
cordova create cordova_project
// 3. 添加需要打包的平台
cordova platform add android
// 4. 运行或者打包
cordova run android
cordova build androidvue-cli打包完成后
- 错误信息:
postcss-svgo: Error in parsing SVG: Unquoted attribute value
- 需要修改mui.css中的 图片引用 单引号全部改成双引号
- 提示必须使用服务器的方式打开,即使用localhost方式打开
// 1. 安装http-server
npm i http-server -g
// 2. 使用hs -o命令打开index.html文件
hs -o- 如果打包完成后希望直接用file协议打开,需要修改config/index.js 中的build下的
assetsPublicPath: '/'换成assetsPublicPath: './'
OM节点
v-show:实现元素隐藏显示切换的时候,是操作DOM元素的样式，display:block/display:none
如果元素显示隐藏切换的比较频繁,用v-show
如果元素一开始不显示,后期满足某个条件时才显示,而且切换不频繁,用v-if
// 用v-on给第三方组件绑定事件的时候,有时候不一定能绑上去,需要使用native修饰符
双向数据绑定原理:
M-V:数据劫持,Object.defineProperty,get、set(数组下标改变数据、length属性改变数据、如果数据不是提前在data中进行定义，这三种情况Object.defineProperty都无法进行劫持)
Vue3.0以后使用 ES6 中的Proxy(代理)进行数据劫持
V-M:监听表单元素的change事件
axios:(如何坚持当前js运行环境是Node还是浏览器?直接访问window对象,如果存在是浏览器,如果不存在是node;直接全局访问this,如果是window则是浏览器,如果是undefined则是node)
浏览器平台:XMLHttpRequest
Node平台:http.request()
vue-resource:专门为vue开发的请求库
移动端项目: vue-cli + vuex + axios + mui + mint-ui + 组件传值(父向子用属性传递/子向父用$emit) + watch(监听路由) + vue-loader(深度样式作用选择器/deep/ >>>) + vue-preview(缩略图预览) + flex布局 + vue过渡动画(css类/动画钩子函数) + sass
## HBuilder打包
> HBuilder打包 是将前端开发的HTML/CSS/JS文件进行打包,打包成可以直接安装在手机上面的App,不借助浏览器就可以直接运行
```JavaScript
1. 使用webpack将项目进行打包,打包好的文件会在dist目录
webpack -p
2. 打开Hbuilder,新建移动App项目,然后删掉css/js/imgs文件夹和index.html文件
3. 将使用webpack打包的dist目录里面的文件全部拷贝到新建的移动项目目录中
4. 选中HTML文件,点击HBuilder导航上面的`发行`-`打原生安装包`,直接下一步,选安卓公共证书-`打包`
5. 在项目的`unpackage\release`中可以得到打包完毕的apk文件cordova打包
直接在本地进行打包
需要电脑配置Java环境和Android环境 (配置方式参考react native课程第一天)
// 1. 安装全局cordova
npm i cordova -g
// 2. 创建cordova项目
cordova create cordova_project
// 3. 添加需要打包的平台
cordova platform add android
// 4. 运行或者打包
cordova run android
cordova build androidvue-cli打包完成后
- 错误信息:
postcss-svgo: Error in parsing SVG: Unquoted attribute value
- 需要修改mui.css中的 图片引用 单引号全部改成双引号
- 提示必须使用服务器的方式打开,即使用localhost方式打开
// 1. 安装http-server
npm i http-server -g
// 2. 使用hs -o命令打开index.html文件
hs -o- 如果打包完成后希望直接用file协议打开,需要修改config/index.js 中的build下的
assetsPublicPath: '/'换成assetsPublicPath: './'
