Skip to content

Commit

Permalink
chore: feat taro vue init project
Browse files Browse the repository at this point in the history
  • Loading branch information
richard1015 committed Jun 2, 2021
1 parent 03c8b7f commit c88da36
Show file tree
Hide file tree
Showing 66 changed files with 2,716 additions and 17 deletions.
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ package-lock.json
/cache
/src/nutui.ts
/src/packages/nutui.vue.ts
/src/packages/nutui.taro.vue.ts
/tsc/test


Expand Down
39 changes: 39 additions & 0 deletions jd/generate-nutui-taro-vue.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
const package = require('../package.json');
const config = require('../src/config.json');
const path = require('path');
const fs = require('fs-extra');
let importStr = `import { App } from 'vue';\n`;
const packages = [];
config.nav.map(item => {
item.packages.forEach(element => {
let { name, show, type, taro } = element;
if (show && taro) {
importStr += `import ${name} from './__VUE/${name.toLowerCase()}/index${
type === 'methods' ? '' : '.taro.vue'
}';\n`;
packages.push(name);
}
});
});
let installFunction = `function install(app: App) {
const packages = [${packages.join(',')}];
packages.forEach((item:any) => {
if (item.install) {
app.use(item);
} else if (item.name) {
app.component(item.name, item);
}
});
}`;
let fileStr = `${importStr}
${installFunction}
export { ${packages.join(',')} };
export default { install, version:'${package.version}'};`;
fs.outputFile(
path.resolve(__dirname, '../src/packages/nutui.taro.vue.ts'),
fileStr,
'utf8',
error => {
// logger.success(`${package_config_path} 文件写入成功`);
}
);
3 changes: 3 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,9 @@
],
"scripts": {
"checked": "npm run generate:file && tsc",
"checked:taro:vue": "npm run generate:file:taro:vue && tsc",
"dev": "npm run checked && vite --open --force",
"dev:taro:vue": "npm run checked:taro:vue && cd src/sites/mobile-taro/vue/ && npm run dev:weapp",
"build:site": "npm run checked && vite build",
"build:gh-pages": "npm run checked && vite build --base=/nutui/",
"build:site:oss": "npm run checked && vite build --base=/nutui/3x/",
Expand All @@ -48,6 +50,7 @@
"add": "node jd/createComponentMode.js",
"publish:beta": "npm publish --tag=beta",
"generate:file": "node jd/generate-nutui.js",
"generate:file:taro:vue": "node jd/generate-nutui-taro-vue.js",
"generate:types": "node jd/generate-types.js",
"generate:themes": "node jd/generate-themes.js",
"prepare": "husky install",
Expand Down
10 changes: 10 additions & 0 deletions src/config.json
Original file line number Diff line number Diff line change
Expand Up @@ -85,6 +85,7 @@
"packages": [
{
"name": "Button",
"taro": true,
"sort": 1,
"cName": "按钮组件",
"type": "component",
Expand Down Expand Up @@ -112,6 +113,7 @@
},
{
"name": "Layout",
"taro": true,
"sort": 4,
"cName": "布局",
"type": "component",
Expand Down Expand Up @@ -215,6 +217,7 @@
},
{
"name": "Cell",
"taro": true,
"sort": 1,
"cName": "单元格组件",
"type": "component",
Expand Down Expand Up @@ -260,6 +263,7 @@
},
{
"name": "Checkbox",
"taro": true,
"sort": 5,
"cName": "复选按钮",
"type": "component",
Expand Down Expand Up @@ -316,6 +320,7 @@
{
"version": "3.0.0",
"name": "Radio",
"taro": true,
"type": "component",
"cName": "单选按钮",
"desc": "单选按钮",
Expand Down Expand Up @@ -346,6 +351,7 @@
{
"version": "3.0.0",
"name": "OverLay",
"taro": true,
"type": "component",
"cName": "遮罩层",
"desc": "创建一个遮罩层,通常用于阻止用户进行其他操作",
Expand Down Expand Up @@ -403,6 +409,7 @@
},
{
"name": "Steps",
"taro": true,
"sort": 17,
"cName": "步骤条",
"type": "component",
Expand All @@ -426,6 +433,7 @@
"packages": [
{
"name": "Navbar",
"taro": true,
"sort": 3,
"cName": "导航组件",
"type": "componment",
Expand Down Expand Up @@ -462,6 +470,7 @@
},
{
"name": "Tabbar",
"taro": true,
"sort": 2,
"cName": "标签栏组件",
"type": "component",
Expand Down Expand Up @@ -514,6 +523,7 @@
{
"version": "3.0.0",
"name": "Switch",
"taro": true,
"type": "component",
"cName": "开关组件",
"desc": "用来打开或关闭选项",
Expand Down
2 changes: 1 addition & 1 deletion src/packages/__VUE/button/demo.vue
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,7 @@

<script lang="ts">
import { ref } from 'vue';
import { createComponent } from '@/packages/utils/create';
import { createComponent } from '../../utils/create';
const { createDemo } = createComponent('button');
export default createDemo({
props: {},
Expand Down
125 changes: 125 additions & 0 deletions src/packages/__VUE/button/index.taro.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,125 @@
<template>
<view :class="classes" :style="getStyle" @click="handleClick">
<view class="nut-button__warp">
<nut-icon class="nut-icon-loading" v-if="loading"></nut-icon>
<nut-icon :class="icon" v-if="icon && !loading" :name="icon"></nut-icon>
<view :class="{ text: icon || loading }" v-if="$slots.default">
<slot></slot>
</view>
</view>
</view>
</template>

<script lang="ts">
import { PropType, CSSProperties, toRefs, computed } from 'vue';
import { createComponent } from '../../utils/create';
const { componentName, create } = createComponent('button');
export type ButtonType =
| 'default'
| 'primary'
| 'info'
| 'success'
| 'warning'
| 'danger';
export type ButtonSize = 'large' | 'normal' | 'small';
export type ButtonShape = 'square' | 'round';
export default create({
props: {
color: String,
shape: {
type: String as PropType<ButtonShape>,
default: 'round'
},
plain: {
type: Boolean,
default: false
},
loading: {
type: Boolean,
default: false
},
disabled: {
type: Boolean,
default: false
},
type: {
type: String as PropType<ButtonType>,
default: 'default'
},
size: {
type: String as PropType<ButtonSize>,
default: 'normal'
},
block: {
type: Boolean,
default: false
},
icon: {
type: String,
default: ''
}
},
emits: ['click'],
setup(props, { emit, slots }) {
const {
type,
size,
shape,
disabled,
loading,
color,
plain,
block
} = toRefs(props);
const handleClick = (event: MouseEvent) => {
if (!loading.value && !disabled.value) {
emit('click', event);
}
};
const classes = computed(() => {
const prefixCls = componentName;
return {
[prefixCls]: true,
[`${prefixCls}--${type.value}`]: type.value,
[`${prefixCls}--${size.value}`]: size.value,
[`${prefixCls}--${shape.value}`]: shape.value,
[`${prefixCls}--plain`]: plain.value,
[`${prefixCls}--block`]: block.value,
[`${prefixCls}--disabled`]: disabled.value,
[`${prefixCls}--loading`]: loading.value
};
});
const getStyle = computed(() => {
const style: CSSProperties = {};
if (color?.value) {
if (plain.value) {
style.color = color.value;
style.background = '#fff';
if (!color.value?.includes('gradient')) {
style.borderColor = color.value;
}
} else {
style.color = '#fff';
style.background = color.value;
}
}
return style;
});
return {
handleClick,
classes,
getStyle
};
}
});
</script>

<style lang="scss">
@import 'index.scss';
</style>
5 changes: 2 additions & 3 deletions src/packages/__VUE/cell/demo.vue
Original file line number Diff line number Diff line change
Expand Up @@ -43,13 +43,12 @@

<script lang="ts">
import { ref } from 'vue';
import { createComponent } from '@/packages/utils/create';
import { Toast } from '@/packages/nutui.vue';
import { createComponent } from '../../utils/create';
const { createDemo } = createComponent('cell');
export default createDemo({
setup() {
const testClick = (event: Event) => {
Toast.text('点击事件');
console.log('点击事件');
};
const switchChecked = ref(true);
return { testClick, switchChecked };
Expand Down
93 changes: 93 additions & 0 deletions src/packages/__VUE/cell/index.taro.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
<template>
<view :class="classes" @click="handleClick">
<slot>
<view
class="nut-cell__title"
:class="{ icon: icon }"
v-if="title || subTitle || icon"
>
<nut-icon v-if="icon" class="icon" :name="icon"></nut-icon>
<template v-if="subTitle">
<view class="title">{{ title }}</view>
<view class="nut-cell__title-desc">{{ subTitle }}</view>
</template>
<template v-else>
{{ title }}
</template>
</view>
<view
v-if="desc"
class="nut-cell__value"
:style="{ 'text-align': descTextAlign }"
>{{ desc }}</view
>

<slot v-if="$slots.link" name="link"></slot>
<nut-icon
v-else-if="isLink || to"
class="nut-cell__link"
name="right"
></nut-icon>
</slot>
</view>
</template>

<script lang="ts">
import { computed } from 'vue';
import { createComponent } from '../../utils/create';
import { useRouter } from 'vue-router';
import CellGroup from '../cellgroup/index.vue';
const { componentName, create } = createComponent('cell');
export default create({
props: {
title: { type: String, default: '' },
subTitle: { type: String, default: '' },
desc: { type: String, default: '' },
descTextAlign: { type: String, default: 'right' },
isLink: { type: Boolean, default: false },
to: { type: String, default: '' },
replace: { type: Boolean, default: false },
url: { type: String, default: '' },
icon: { type: String, default: '' }
},
emits: ['click'],
components: {
[CellGroup.name]: CellGroup
},
setup(props, { emit }) {
const classes = computed(() => {
const prefixCls = componentName;
return {
[prefixCls]: true,
[`${prefixCls}--clickable`]: props.isLink || props.to
};
});
const router = useRouter();
const handleClick = (event: Event) => {
emit('click', event);
if (props.to && router) {
router[props.replace ? 'replace' : 'push'](props.to);
// if(props.replace){
// router.replace(props.to)
// }else{
// router.push(props.to)
// }
} else if (props.url) {
props.replace
? location.replace(props.url)
: (location.href = props.url);
}
};
return {
handleClick,
classes
};
}
});
</script>

<style lang="scss">
@import 'index.scss';
</style>
2 changes: 1 addition & 1 deletion src/packages/__VUE/cellgroup/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@

<script lang="ts">
import { computed } from 'vue';
import { createComponent } from '@/packages/utils/create';
import { createComponent } from '../../utils/create';
const { componentName, create } = createComponent('cell-group');
export default create({
props: {
Expand Down
Loading

0 comments on commit c88da36

Please sign in to comment.