didi / chameleon Goto Github PK
View Code? Open in Web Editor NEW🦎 一套代码运行多端,一端所见即多端所见
Home Page: http://cml.didi.cn/
License: Apache License 2.0
🦎 一套代码运行多端,一端所见即多端所见
Home Page: http://cml.didi.cn/
License: Apache License 2.0
可以支持sass语法吗
cli是英语,法语还是西班牙语? 任何人都会这样做 谢谢。
Is the cli English, Spanish or French? Any would do. Thank you.
非常欢迎加入扩展新端共建工作,可以先看看一下资料,有兴趣可以加入QQ群联系我们,过程中的技术细节会全力支持。
1、扩展新端教程:https://cml.js.org/doc/extend/extend.html
2、字节跳动扩展小程序日志:https://mp.weixin.qq.com/s/7nsgH7Ow0RkCV12zxiVl7Q
3、字节跳动小程序扩展实现仓库:https://github.com/chameleon-team/cml-tt-sets
4、快应用扩展实现仓库:https://github.com/quickappcn/cml-extplatform-quickapp/tree/fix-runtime
bug描述
子组件emit事件h5接收不到微信却可以
复现bug的步骤
1.子组件emit click事件
this.$cmlEmit('click', e)
<v-item :disabled="disabled" extra="" @click="disabledHandler">Click to disable</v-item>
问题截图
编译环境信息
运行环境信息
运行快速上手教程实例,语法体验部分代码运行起来,中文字符被编译成问号。
编译环境信息
npm i -g chameleon-tool执行报错
npm warn tar zlib error: unexpected end of file
cb() never called!
过了文档看好Chameleon的。最起码写法相对更友好。设计更合理吧。
用了Taro感觉设计上有点违和,我猜一开始肯定是想弄一个小程序的工具,后来不得已要兼容很多模式。😝
希望不是一个KPI的项目。开源加油..
node v8.9.3
npm 5.5.1
cml 0.0.11
使用c-loading组件时,微信小程序真机调试时报错,尝试使用示例代码,仍然会报错
错误log:Cannot read property 'mask' of undefined;at setTimeout callback function
TypeError: Cannot read property 'mask' of undefined
at Function. (weapp:///static/js/npm/cml-ui/components/c-loading/c-loading.js:137:47)
bug描述
描述出现的问题
复现bug的步骤
问题截图
编译环境信息
运行环境信息
(1)weex 在阿里已经大面积弃用了
如果这样,未来 chameleon 的价值又在哪里呢,大量的维护鸡肋的工作吗?
(2)官方的demo
编译出来的BUG ,"navigationBarTextStyle": "#fff"; 类似版本更新的问题,未来如何解决?
(3)是否可以给出一些性能测试的数据、稳定性、兼容性的数据和一些相对丰富的案例。
那些产品使用了它进行了业务开发?
(4)工具链路上和开发规范上
对 VScode、webStrom 插件的支持,代码提醒、高亮、预发检测工具。有的官方文档要推荐,没有的补上。代码规范给出一个 eslint 基础版,文件约定,给出官方的一个最佳实践,目前写在一起,不够优雅。
cml版本: [email protected]
操作系统: CentOS Linux release 7.2.1511 (Core)
nodejs: v10.15.0
浏览器: google chrome 51.0.2704.106 (64-bit)
执行命令:
cml init project --demo todo
cd todo
cml dev
只干了这么3个命令。
浏览器运行起来后预览无任何页面。
有没有demo学习下
env:
node v11.6.0
npm 6.5.0
cml 0.0.11
$ cml dev
[INFO] start Compiling...
[INFO] weex Compiling...
ERROR Failed to compile with 8 errors 1:37:05 PM
These dependencies were not found:
To install them, you can run: npm install --save $PROJECT/src/app/app.cml $PROJECT/src/pages/index/index.cml vue-router
This relative module was not found:
我看有人问过这个问题,并没有回答,直接关闭了。
有就有,没有就没有。
目前只有那人严选的 Demo。
目前建议使用在生产环境吗,希望得到官方的态度。
现在可以直接 build 为 ios & android 安装包吗,像 cordova 那样,文档上没太找到这块。
1、像c-fresh
组件的使用,只是给个例子,就没有文档说明了,只有看源码才能知道使用方法,建议还是添加详细说明文档,文档地址:
https://cmljs.org/doc/example/c-refresh.html
2、scroller
组件的举例说明文档里面说滚动事件是:onscroll,在c-fresh举例却是其他:
https://cmljs.org/doc/example/scroller.html
而文档说明中并没有说明清楚。
建议还是先把文档说明都补充完整
首先感谢你们的开源付出
大概看了一遍api,没发现支付功能的api,是要自己去chameleon-api扩展吗
谢谢!
bug描述
描述出现的问题
复现bug的步骤
问题截图
编译环境信息
运行环境信息
bug描述
In webpack4 * CommonsChunkPlugin
was removed -> optimization.splitChunks
复现bug的步骤
module.exports.chameleon = function(type, mode, config) {
const modePreset = {
'dev': {
cmlType: type,
media: `dev`,
hot: true,
disableExtract: false,
context: path.join(__dirname,'../'),
wxConfig: config
},
'build': {
cmlType: type,
media: `build`,
hot: false,
disableExtract: false,
wxConfig: config
}
}
return getConfig({
... modePreset[mode]
})
}
--------
merge(originWebpackConfig, chameleon('baidu', 'dev', {entry: [...]}) )
编译环境信息
webpack: 4.23.0
小程序的一些api,在低版本不支持,请问这方面兼容做了吗?
bug描述
描述出现的问题
这里的titlebar在小程序和web并不支持,却没有在文档上面说明
复现bug的步骤
1、如上图所示,https://cmljs.org/doc/example/page.html
编译环境信息
运行环境信息
在安装时支持通过参数切换npm-client
bug描述
描述出现的问题
c-model="{{ appkey }}"
appkey两边加上空格,双向绑定数据失效
复现bug的步骤
<input type="text" c-model="{{ appkey }}" ></input>
<text>{{ appkey }}</text>
问题截图
编译环境信息
<list
bottom-offset="{{bottomOffset}}"
c-bind:scrolltobottom="onBottom"
c-bind:onscroll="onScroll"
height="{{winHeight}}"
>
<c-refresh
display="{{ topRefreshing }}"
c-bind:refreshevent="onrefreshUp"
>
</c-refresh>
</list>
methods = {
onrefreshUp (e) {
this.topRefreshing = e.detail.value
setTimeout(() => {
this.topRefreshing = false
}, 2000)
},
`onScroll(e)` {
let scrollTop = e.detail.scrollTop;
if (scrollTop <= 0) {
this.topRefreshing = true;
}
}
}
"dependencies": {
"chameleon-api": "0.0.16",
"chameleon-bridge": "0.0.10",
"chameleon-runtime": "0.0.3",
"chameleon-store": "0.0.3",
"chameleon-ui-builtin": "0.0.4",
"cml-ui": "0.0.3"
}
报错信息
文件位置: /Users/macliu/Desktop/FirstChameleonTest/node_modules/chameleon-ui-builtin/components/list/list.interface
错误信息: event onscroll detail 参数校验失败
定义了Number类型的参数,传入的却是Promise,请检查所传参数是否和接口定义的一致
滴滴全员会宣布过冬:将裁员15%涉及员工超2000人
这个项目还会继续吗
超了100人了
手把手教你系列- 变色龙SDK使用范例,这个文档,看到4.4.2 js 侧的实现
就不懂了,是在实现业务的那个页面调用在native 侧注册的模块吗?
cml init project
生成的是一个前端文件夹,chameleon-sdk-android
下载又是另一个文件夹,怎么结合起来呢?
比如我现在调用cml.chooseImage
这个方法,那在这个业务页面应该怎么来引入SDK?
纯前端看到这个很吃力,希望文档描述能更详细一点!
想练练手写个微信小程序,直接用小程序的tabBar的icon路径不知道怎么定义,用c-tab也不知道怎么写图片
bug描述
描述出现的问题
复现bug的步骤
问题截图
编译环境信息
运行环境信息
内部有使用这个框架来开发一些真实项目么?
bug描述
使用flex做布局,发现在H5的展示效果不对,具体的看截图。
编译环境信息
运行环境信息
<template>
<view class="container">
<view class="flex-item" c-bind:tap="handleNavigateToAPI">
<text class="flex-item-text">API</text>
</view>
<view class="flex-item" c-bind:tap="handleNavigateToComponents">
<text class="flex-item-text">Components</text>
</view>
</view>
</template>
<script>
import cml from "chameleon-api"
class Index {
data = {
message: 'Hello Chameleon!',
}
methods = {
handleNavigateToAPI() {
cml.navigateTo({
path: '/pages/api/api'
})
},
handleNavigateToComponents() {
cml.navigateTo({
path: '/pages/components/components'
})
}
}
}
export default new Index();
</script>
<style scoped>
.container {
flex: 1;
flex-direction: column;
justify-content: space-around;
align-items: center;
}
.flex-item {
width: 400cpx;
height: 400cpx;
flex-direction: row;
justify-content: center;
align-items: center;
background: lightblue;
}
.flex-item-text {
font-size: 50cpx;
color: #222222;
}
</style>
<script cml-type="json">
{}
</script>
bug描述
描述出现的问题
复现bug的步骤
问题截图
编译环境信息
运行环境信息
bug描述
scroller中嵌套list组件初始化报错,错误如下:
纵向滚动必须传递高度属性
复现bug的步骤
问题截图
编译环境信息
运行环境信息
代码
<template>
<page title="chameleon">
<scroller height="{{-1}}">
<view class="scroller-wrap">
<demo-com title="{{title}}" image-src="{{chameleonSrc}}"></demo-com>
</view>
<list>
<cell>
<text>1</text>
</cell>
<cell>
<text>2</text>
</cell>
<cell>
<text>3</text>
</cell>
</list>
</scroller>
</page>
</template>
<style>
</style>
<script>
class Scroll {
data = {
title: "chameleon",
chameleonSrc: require('../../assets/images/chameleon.png')
}
}
export default new Scroll();
</script>
<script cml-type="json">
{
"base": {
"usingComponents": {
"demo-com": "/components/demo-com/demo-com"
}
},
"wx": {
"navigationBarTitleText": "scroller",
"backgroundTextStyle": "dark",
"backgroundColor": "#E2E2E2"
}
}
</script>
bug描述
scroller中嵌套carousel,会造成滑动聚焦错误的问题。
复现bug的步骤
问题截图
编译环境信息
运行环境信息
代码
<template>
<page title="chameleon">
<scroller height="{{-1}}">
<view class="scroller-wrap">
<demo-com title="{{title}}" image-src="{{chameleonSrc}}"></demo-com>
</view>
<view class="view-demo-row">
<view class="red view">
<text>1</text>
</view>
<view class="blue view">
<text>2</text>
</view>
<view class="green view">
<text>3</text>
</view>
</view>
<view>
<button>
<text>asda</text>
</button>
</view>
<list>
<cell>
<text>1</text>
</cell>
<cell>
<text>2</text>
</cell>
<cell>
<text>3</text>
</cell>
</list>
<view>
<container direction="column">
<head>
<view>
<text>header</text>
</view>
</head>
<container direction="row" style="flex:1;">
<aside>
<view>
<text>aside</text>
</view>
</aside>
<container direction="column" style="flex:1">
<main style="flex:1;">
<view>
<text>main</text>
</view>
</main>
<foot>
<view>
<text>foot</text>
</view>
</foot>
</container>
</container>
</container>
</view>
<view>
<carousel class="container" indicator-dots="{{true}}" current="{{1}}" circular="{{true}}">
<carousel-item>
<view class="carousel-item" style="background-color: #EBDEAA"></view>
</carousel-item>
<carousel-item>
<view class="carousel-item" style="background-color: #E3EDCD"></view>
</carousel-item>
<carousel-item>
<view class="carousel-item" style="background-color: #EAEAEF"></view>
</carousel-item>
</carousel>
</view>
<view>
<view>
<input placeholder="请输入你的用户名"></input>
</view>
<view>
<textarea placeholder="focus聚焦"></textarea>
</view>
<view>
<switch
label="Switch"
></switch>
</view>
</view>
</scroller>
</page>
</template>
<script>
class Index {
data = {
title: "chameleon",
chameleonSrc: require('../../assets/images/chameleon.png')
}
}
export default new Index();
</script>
<style >
.red {
background-color: red;
}
.blue {
background-color: blue;
}
.green {
background-color: green;
}
.scroller-wrap {
display: flex;
flex-direction: column;
align-items: center;
}
.view-demo-row {
display: flex;
flex-direction: row;
align-items: center;
width: 100%;
}
.view-demo-row > .view {
flex: 1;
}
.carousel-item {
height: 300cpx;
width: 750cpx;
}
</style>
<script cml-type="json">
{
"base": {
"usingComponents": {
"demo-com": "/components/demo-com/demo-com"
}
},
"wx": {
"navigationBarTitleText": "index",
"backgroundTextStyle": "dark",
"backgroundColor": "#E2E2E2"
}
}
</script>
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.