@ecolovo/uniapp-components 1.0.10 → 2.0.1

package/configs/index.js

@@ -1,42 +1,40 @@
+import defaultIconfonts from '../resources/iconfont/uniapp_ui_icon/iconfont.json';
 /** 组件前缀 */
 let componentPrefix = 'app';
 /** 首页路径 */
 let homePath = '/pages/index/index';
-
 /**
  * 设置组件前缀
- * @param {string} prefix 组件前缀
+ * @param prefix 组件前缀
  */
-function setComponentPrefix(prefix) {
+function setComponentPrefix(prefix = 'app') {
+	if (!prefix) throw new Error('组件前缀不能为空');
 	componentPrefix = prefix;
 }
-
 /**
  * 设置首页路径
- * @param {string} path 首页路径
+ * @param path 首页路径
  */
-function setHomePath(path) {
+function setHomePath(path = '/pages/index/index') {
+	if (!path) throw new Error('app 首页不能为空');
 	homePath = path;
 }
-
 /** iconfont 图标 map */
 const iconMap = new Map();
-
 /**
  * 添加单个图标
- * @param {string} fontFamily 字体文件名
- * @param {string} prefix 图标前缀
- * @param {string} name 图标名称
+ * @param fontFamily 字体文件名
+ * @param prefix 图标前缀
+ * @param name 图标名称
  */
 function addIconToMap(fontFamily, prefix, name) {
 	if (iconMap.has(name)) {
 		// eslint-disable-next-line no-console
-		console.error(
+		console.warn(
 			`图标库 "${fontFamily}" 中的图标 "${name}" 在图标库 "${
 				iconMap.get(name).fontFamily
-			}" 中已存在，这个图标将被忽略`
+			}" 中已存在，新的图标将会覆盖已存在的同名图标`
 		);
-		return;
 	}
 	iconMap.set(name, {
 		fontFamily,
@@ -44,14 +42,9 @@ function addIconToMap(fontFamily, prefix, name) {
 		name,
 	});
 }
-
 /**
  * 添加一组图标，传入 iconfont.json 文件内容
- * @param {object} iconJson iconfont.json 文件内容
- * @param {string} iconJson.font_family
- * @param {string} iconJson.css_prefix_text
- * @param {object[]} iconJson.glyphs
- * @param {string} iconJson.glyphs.font_class
+ * @param iconJson iconfont.json 文件内容
  */
 function addIcons(iconJson) {
 	const fontFamily = iconJson.font_family;
@@ -61,8 +54,6 @@ function addIcons(iconJson) {
 		addIconToMap(fontFamily, prefix, glyph.font_class);
 	});
 }
-
 // 添加内部图标库
-addIcons(require('../resources/iconfont/uniapp_ui_icon/iconfont.json'));
-
+addIcons(defaultIconfonts);
 export { componentPrefix, homePath, setComponentPrefix, setHomePath, iconMap, addIcons };

package/configs/index.ts

@@ -0,0 +1,82 @@
+import defaultIconfonts from '../resources/iconfont/uniapp_ui_icon/iconfont.json';
+
+/** 组件前缀 */
+let componentPrefix = 'app';
+/** 首页路径 */
+let homePath = '/pages/index/index';
+
+/**
+ * 设置组件前缀
+ * @param prefix 组件前缀
+ */
+function setComponentPrefix(prefix: string = 'app') {
+	if (!prefix) throw new Error('组件前缀不能为空');
+	componentPrefix = prefix;
+}
+
+/**
+ * 设置首页路径
+ * @param path 首页路径
+ */
+function setHomePath(path: string = '/pages/index/index') {
+	if (!path) throw new Error('app 首页不能为空');
+	homePath = path;
+}
+
+interface IconInfo {
+	/** 字体文件名 */
+	fontFamily: string;
+	/** 图标前缀 */
+	prefix: string;
+	/** 图标名称 */
+	name: string;
+}
+
+/** iconfont 图标 map */
+const iconMap: Map<string, IconInfo> = new Map();
+
+/**
+ * 添加单个图标
+ * @param fontFamily 字体文件名
+ * @param prefix 图标前缀
+ * @param name 图标名称
+ */
+function addIconToMap(fontFamily: string, prefix: string, name: string) {
+	if (iconMap.has(name)) {
+		// eslint-disable-next-line no-console
+		console.warn(
+			`图标库 "${fontFamily}" 中的图标 "${name}" 在图标库 "${
+				iconMap.get(name)!.fontFamily
+			}" 中已存在，新的图标将会覆盖已存在的同名图标`
+		);
+	}
+	iconMap.set(name, {
+		fontFamily,
+		prefix,
+		name,
+	});
+}
+
+export interface IconFontJson {
+	font_family: string;
+	css_prefix_text: string;
+	glyphs: { font_class: string }[];
+}
+
+/**
+ * 添加一组图标，传入 iconfont.json 文件内容
+ * @param iconJson iconfont.json 文件内容
+ */
+function addIcons(iconJson: IconFontJson) {
+	const fontFamily = iconJson.font_family;
+	const prefix = iconJson.css_prefix_text;
+	const glyphs = iconJson.glyphs;
+	glyphs.forEach((glyph) => {
+		addIconToMap(fontFamily, prefix, glyph.font_class);
+	});
+}
+
+// 添加内部图标库
+addIcons(defaultIconfonts);
+
+export { componentPrefix, homePath, setComponentPrefix, setHomePath, iconMap, addIcons };

package/easyCom.d.ts

@@ -0,0 +1,9 @@
+declare function componentEasyCom(componentPrefix?: string): {
+	easycom: {
+		autoscan: boolean;
+		custom: {
+			[x: string]: string;
+		};
+	};
+};
+export default componentEasyCom;

package/easyCom.js

@@ -26,6 +26,5 @@ function componentEasyCom(componentPrefix = 'app') {
 		},
 	};
 }
-
 // 导出 easycom 配置
-module.exports = componentEasyCom;
+export default componentEasyCom;

package/easyCom.ts

@@ -0,0 +1,31 @@
+function componentEasyCom(componentPrefix = 'app') {
+	return {
+		easycom: {
+			autoscan: true,
+			custom: {
+				[`^${componentPrefix}-date-picker-view`]:
+					'@ecolovo/uniapp-components/components/date-picker/date-picker-view.vue',
+				[`^${componentPrefix}-dialog-content`]:
+					'@ecolovo/uniapp-components/components/dialog/dialog-content.vue',
+				[`^${componentPrefix}-loading-animation(.*)`]:
+					'@ecolovo/uniapp-components/components/loading/animations/loading-animation$1.vue',
+				[`^${componentPrefix}-page-(.*)`]: '@ecolovo/uniapp-components/components/page/page-$1.vue',
+				[`^${componentPrefix}-password-input`]:
+					'@ecolovo/uniapp-components/components/input/password-input.vue',
+				[`^${componentPrefix}-picker-popup`]: '@ecolovo/uniapp-components/components/picker/picker-popup.vue',
+				[`^${componentPrefix}-popover-content`]:
+					'@ecolovo/uniapp-components/components/popover/popover-content.vue',
+				[`^${componentPrefix}-popover-mask`]: '@ecolovo/uniapp-components/components/popover/popover-mask.vue',
+				[`^${componentPrefix}-popup-content`]: '@ecolovo/uniapp-components/components/popup/popup-content.vue',
+				[`^${componentPrefix}-media-uploader`]:
+					'@ecolovo/uniapp-components/components/uploader/media-uploader.vue',
+				[`^${componentPrefix}-file-uploader`]:
+					'@ecolovo/uniapp-components/components/uploader/file-uploader.vue',
+				[`^${componentPrefix}-(.*)`]: '@ecolovo/uniapp-components/components/$1/$1.vue',
+			},
+		},
+	};
+}
+
+// 导出 easycom 配置
+export default componentEasyCom;

package/index.d.ts

@@ -0,0 +1 @@
+export { default as init } from './init';

package/index.js

@@ -0,0 +1 @@
+export { default as init } from './init';

package/index.ts

@@ -0,0 +1 @@
+export { default as init } from './init';

package/init.d.ts

@@ -1,5 +1,4 @@
-import { IconFontJson } from './configs';
-
+import type { IconFontJson } from './configs';
 /** 组件库初始化配置 */
 interface InitOptions {
 	/** 组件前缀 */
@@ -9,11 +8,9 @@ interface InitOptions {
 	/** iconfont 图标 json 文件 */
 	iconfont?: IconFontJson | IconFontJson[];
 }
-
 /**
- * 初始化组件库
- * @param {InitOptions} options 组件库初始化配置
+ * 组件库初始化方法，在使用组件库前调用
+ * @param options 组件库初始化配置
  */
-declare const init: (options: InitOptions) => void;
-
+declare function init(options?: InitOptions): void;
 export default init;

package/init.js

@@ -1,6 +1,8 @@
-const { setComponentPrefix, setHomePath, addIcons } = require('./configs');
-
-/** 组件库初始化方法，在 main.js 中调用 */
+import { setComponentPrefix, setHomePath, addIcons } from './configs';
+/**
+ * 组件库初始化方法，在使用组件库前调用
+ * @param options 组件库初始化配置
+ */
 function init(options = {}) {
 	if (options.componentPrefix) {
 		setComponentPrefix(options.componentPrefix);
@@ -16,5 +18,4 @@ function init(options = {}) {
 		}
 	}
 }
-
 export default init;

package/init.ts

@@ -0,0 +1,34 @@
+import { setComponentPrefix, setHomePath, addIcons } from './configs';
+import type { IconFontJson } from './configs';
+
+/** 组件库初始化配置 */
+interface InitOptions {
+	/** 组件前缀 */
+	componentPrefix?: string;
+	/** 首页路径 */
+	homePath?: string;
+	/** iconfont 图标 json 文件 */
+	iconfont?: IconFontJson | IconFontJson[];
+}
+
+/**
+ * 组件库初始化方法，在使用组件库前调用
+ * @param options 组件库初始化配置
+ */
+function init(options: InitOptions = {}) {
+	if (options.componentPrefix) {
+		setComponentPrefix(options.componentPrefix);
+	}
+	if (options.homePath) {
+		setHomePath(options.homePath);
+	}
+	if (options.iconfont) {
+		if (Array.isArray(options.iconfont)) {
+			options.iconfont.forEach(addIcons);
+		} else {
+			addIcons(options.iconfont);
+		}
+	}
+}
+
+export default init;

package/package.json

@@ -1,9 +1,11 @@
 {
 	"name": "@ecolovo/uniapp-components",
-	"version": "1.0.10",
-	"description": "Ecolovo UniApp 组件库",
+	"version": "2.0.1",
+	"description": "Ecolovo UniApp Vue3 组件库",
 	"scripts": {
-		"lint": "eslint . --fix"
+		"lint": "eslint",
+		"lint:fix": "eslint --fix",
+		"build": "tsc"
 	},
 	"keywords": [
 		"uniapp",
@@ -12,18 +14,26 @@
 	"author": "Yang",
 	"license": "ISC",
 	"dependencies": {
+		"@ecolovo/utils": "^1.0.7",
 		"case-anything": "3.1.2",
-		"lodash-es": "4.17.21"
+		"lodash-es": "4.17.21",
+		"vue": "^3.4.21"
 	},
 	"devDependencies": {
 		"@dcloudio/types": "^3.4.30",
 		"@eslint/js": "^10.0.1",
+		"@types/lodash-es": "^4.17.12",
+		"@vue/eslint-config-prettier": "^10.2.0",
+		"@vue/eslint-config-typescript": "^14.8.0",
+		"@vue/tsconfig": "^0.1.3",
 		"eslint": "^10.0.3",
 		"eslint-config-prettier": "^10.1.8",
 		"eslint-plugin-prettier": "^5.5.5",
 		"eslint-plugin-vue": "^10.8.0",
 		"globals": "^17.4.0",
+		"miniprogram-api-typings": "^5.2.1",
 		"prettier": "^2.8.8",
+		"typescript": "^4.9.4",
 		"vue-eslint-parser": "^10.4.0"
 	}
 }

package/styles/utils/css-var.scss

@@ -4,11 +4,8 @@
 @use 'sass:string';
 @use '../var/theme' as *;
 
-$component-name: null !default;
-$component-vars: null !default;
-
 // 返回组件外部变量名
-@function UTILS__VAR_NAME($name, $component: $component-name) {
+@function UTILS__VAR_NAME($name, $component) {
 	@return string.unquote('--#{$component-prefix}-#{$component}--#{$name}');
 }
 
@@ -25,7 +22,7 @@ $component-vars: null !default;
 }
 
 // 返回组件外部变量值
-@function UTILS__VAR($name, $component: $component-name, $default: null) {
+@function UTILS__VAR($name, $component, $default: null) {
 	@if $default != null {
 		@return var(UTILS__VAR_NAME($name, $component), $default);
 	}
@@ -43,17 +40,17 @@ $component-vars: null !default;
 }
 
 // 定义组件变量
-@mixin UTILS__DEFINE_COMPONENT_VARS() {
-	@if not $component-name {
-		@error "请在调用 UTILS__DEFINE_COMPONENT_VARS 之前设置 $component-name";
+@mixin UTILS__DEFINE_COMPONENT_VARS($vars, $name) {
+	@if not $name {
+		@error "请传入 $name";
 	}
 
-	@if (not $component-vars) or (meta.type-of($component-vars) != 'map') {
-		@error "请在调用 UTILS__DEFINE_COMPONENT_VARS 之前设置 $component-vars";
+	@if (not $vars) or (meta.type-of($vars) != 'map') {
+		@error "请传入 $vars";
 	}
 
-	@each $key, $value in $component-vars {
-		@include __DO_NOT_USE__define-component-var($key, $value);
+	@each $key, $value in $vars {
+		@include __DO_NOT_USE__define-component-var($name, $key, $value);
 	}
 }
 
@@ -65,12 +62,12 @@ $component-vars: null !default;
 }
 
 // 定义单个组件变量，不要直接调用
-@mixin __DO_NOT_USE__define-component-var($name, $value) {
+@mixin __DO_NOT_USE__define-component-var($component, $name, $value) {
 	@if not $component-prefix {
 		@error "请在调用 __DO_NOT_USE__define-component-var 之前设置 component-prefix";
 	}
 
-	$var-prefix: '#{$component-prefix}-#{$component-name}';
+	$var-prefix: '#{$component-prefix}-#{$component}';
 
 	$default: false;
 
@@ -78,7 +75,7 @@ $component-vars: null !default;
 		$default: true;
 	}
 
-	$var-name: UTILS__VAR_NAME($name);
+	$var-name: UTILS__VAR_NAME($name, $component);
 	$local-name: __DO_NOT_USE__local-var-name($name);
 
 	@if $default {

package/styles/utils/ellipsis.scss

@@ -1,10 +1,3 @@
-// 单行
-.ellipsis {
-	overflow-x: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-}
-
 @mixin UTILS__ELLIPSIS($line: 1) {
 	@if $line < 1 {
 		@error "$line 必须为非 0 正整数";

package/styles/utils/z-index.scss

@@ -5,6 +5,6 @@
 @use '../var/theme' as *;
 @use './css-var' as *;
 
-@function UTILS__z-index($key: $component-name) {
+@function UTILS__z-index($key) {
 	@return map.get($z-index-maps, $key);
 }