专栏首页技术综合Cordova+React+Ant.design项目搭建

Cordova+React+Ant.design项目搭建

记录一下搭建

1.安装

$ npm install -g create-react-app cordova yarn

2.新建cordova项目

$ cordova create testdev

可以看到项目结构

image.png

3.在cordova项目根目录创建react项目

$ create-react-app src

对 ,就叫src,舒服 然后再安装 ant.design mobile

$ yarn add antd-mobile
$ yarn add babel-plugin-import react-app-rewired --dev

4.进入src目录,修改package.json

"scripts": {
   "start": "react-app-rewired start",
   "build": "react-app-rewired build && ((robocopy .\\build ..\\www /MIR) & exit 0)",,
   "test": "react-app-rewired test --env=jsdom",
}

5.再src目录下,新建config-overrides.js

const { injectBabelPlugin } = require('react-app-rewired');
module.exports = function override(config, env) {
  config = injectBabelPlugin(['import', { libraryName: 'antd-mobile', style: 'css' }], config);
  return config;
};

6.开发时,使用

$ yarn start

7.手机调试使用

src目录下

$ yarn build 

在cordova项目根目录下

卡在gradle的话,网速问题

$ cordova platform add android
$ cordova run android

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 移动端下拉筛选

    治电小白菜
  • 前端知识复习(一)

    span不可以,img和video可以 span 属于行内非替换元素不能设置宽高,img, video 属于行内替换元素,可以设置宽高

    治电小白菜
  • 搭建简易的物联网服务端和客户端-第一次增补(十一)

    1)处理时间 使用split函数,分隔符为空格,然后将空格前后的数据存入数组,我们只要下标为1的那个数据即可。

    治电小白菜
  • 正则表达式

    共有两种不同的元字符:一种是可以在模式中方括号外任何地方使用的,另外一种 是需要在方括号内使用的。

    老雷PHP全栈开发
  • AXI中wrap边界的计算

    在AXI中,主要是三种猝发模式,FIXED,INCR,WRAP。前两种比较容易理解,第三种的边界计算如下。

    数字IC小站
  • 基础篇-ObjectC继承、类别、属性

        在实际的开发过程中,继承和类别都会得到很多用处。对于界面相似度很高的情况下,使用继承可以节省很多代码和设置,只需要在子类中重写父类中的方法,或者增加新的...

    進无尽
  • Docker搭建比特币测试网络

    1.2 安装RPC支持库kapitalize kapitalize的源码:https://github.com/shamoons/Kapitalize

    foochane
  • Vue 字符串模板 dom模板

    HTML模板(dom模板):直接在HTML页面挂载的模板,就是原先写在页面上的,能被浏览器识别的HTML结构,会在一加载就被浏览器渲染,然后js获取dom节点的...

    前端博客 : alili.tech
  • kubernetes三种打开方式

    kubernetes是容器管理编排引擎,是继openstack之后又一个优秀的云计算系统。kubernetes有着灵活,快速,健壮等特点,同时全面拥抱微服务架构...

    SDNLAB
  • 集会游行的人数统计学

    大数据文摘

扫码关注云+社区

领取腾讯云代金券