Uniappli 的基础知识

总结：基础知识必须易于使用。 我们建议先下载它。 这是官方推荐的。 很多东西都集成到了界面操作中。 首先，从互联网上获取一个开源项目作为演示。 下载地址并配置安装命令安装依赖。 这个项目实际上集成了很多东西，所以检查一下。

uniapp基础知识

为了让uniapp更容易使用，最好先下载HBuildertX。 这是uniapp官方推荐的。 很多都是与界面操作集成的

我们先从网上找一个开源项目作为演示

https://github.com/stavyan/ TinyShop-UniApp

git地址：https://github.com/stavyan/TinyShop-UniApp.git

下载后配置

// 线程命令安装npm i - gyarn//安装依赖yarn

这个项目其实集成了很多东西，你可以在package.json中看到

{ "name ": "TinyShop-UniApp", "version": " 1.0. 0", "私有": true, "脚本": { "serve": "npm run dev:h5", "build": "npm run build:h5", "lint": "vue-cli [k4 ]service lint", "build:app-plus": "cross-env NODE_ENV=生产 UNI_PLATFORM=app-plus vue-cli-Service uni-build", "build:custom": "cross-env NODE_ENV=生产 uniapp-cli custom", "build:h5": "cross-env NODE_ENV=生产 UNI_PLATFORM =h5 vue-cli-service uni-build", "build:mp-alipay": "cross-env NODE_ENV=生产 UNI_PLATFORM=mp-alipay vue-cli[ k4]service uni-build", "build:mp-baidu": "cross-env NODE_ENV=生产 UNI_PLATFORM=mp-baidu vue-cli-service uni-build ", "build:mp-qq": "cross-env NODE_ENV=生产 UNI_PLATFORM=mp-qq vue-cli-service uni-build", "build:mp[k4 ] ]toutiao": "cross-env NODE_ENV=生产 UNI_PLATFORM=mp-toutiao vue-cli-service uni-build", "build:mp-weixin": "cross[ k4] ]env NODE_ENV=生产UNI_PLATFORM=mp-weixin vue-cli-服务uni-build", "changelog": "常规-changelog -p 角度 -i CHANGELOG.md -s -r 0", "commit": "git pull && git-cz" , "dev:app-plus": "cross-env NODE_ENV=开发 UNI_PLATFORM=app-plus vue-cli-service uni-build --watch", "dev:custom": "cross-env NODE_ENV=开发 uniapp-cli 自定义", "dev:h5": "cross-env NODE_ENV=开发 UNI_PLATFORM=h5 vue-cli-service uni-serve", "dev:mp-alipay": "cross-env NODE_ENV=开发 UNI_PLATFORM=mp-alipay vue-cli-Service uni-Build - -watch", "dev:mp-baidu": "cross-env NODE_ENV=开发 UNI_PLATFORM=mp-baidu vue-cli-service uni-build -[ k4]watch", "dev:mp-qq": "cross-env NODE_ENV=开发 UNI_PLATFORM=mp-qq vue-cli-service uni-build --watch", "dev:mp-toutiao": "cross-env NODE_ENV=development UNI_PLATFORM=mp-toutiao vue-cli[ k4]service uni-build --watch", "dev:mp-weixin": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli[k4 ] ]Service uni-build --watch", "info": "node node_modules/@dcloudio/vue-cli-plugin-uni/commands/info.js", " lint :fix": "eslint --ext .js,.vue src -c .eslintrc.js --fix","re​​lease": "release-it "," vue :lint": "vue-cli-service lint","vue:lintfix": "vue-cli-service lint --fix" }, H5 模式用

也可以直接在浏览器中打开

打开微信小程序

首先下载微信开发工具 https://developers.weixin 。 qq.com/miniprogram/dev/devtools/download.html

接下来新建一个微信小程序项目，记住它的AppID（这个测试号可能会有所不同）

创建微信项目后，在hbuilderX中找到src/manifest.json并保存

保存

微信开发前往平台

获取端口号并进入hbuilderx

输入刚刚获取的微信开发工具的端口号和路径。

下一步是开始。

点击微信。 开发工具会自动弹出。

如果你想在手机上运行并预览。

Bug：

每个小程序都有不同的浏览器，所以内核是不同的。 如果某些 CSS 不可读，那就是一个大问题。 但是用js就没有问题了。 转换为 es6/es5