build: 使用 lerna 进行重构

Author: buuing

.gitignore

@@ -1,12 +1,7 @@
 .DS_Store
-*.zip
-*.tgz
 node_modules
 yarn.lock
 package-lock.json
-.vuepress/dist
-dist
-vue3
 
 # local env files
 .env.local
@@ -16,6 +11,7 @@ vue3
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+lerna-debug.log*
 
 # Editor directories and files
 .idea
@@ -24,4 +20,4 @@ yarn-error.log*
 *.ntvs*
 *.njsproj
 *.sln
-*.sw?
+*.sw?

README.md

@@ -1,36 +1,36 @@
 
 <div align="center">
   <img src="https://raw.githubusercontent.com/LuckDraw/lucky-canvas/master/logo.png" width="128" alt="logo" />
-  <h1>vue-luck-draw 抽奖插件</h1>
-  <p>一个基于 vue 的 ( 大转盘 / 九宫格 ) 抽奖插件</p>
+  <h1>lucky-canvas 抽奖插件</h1>
+  <p>一个基于 JavaScript 的 ( 大转盘 / 九宫格 ) 抽奖插件</p>
   <p class="hidden">
-    <a href="https://github.com/LuckDraw/vue-luck-draw#readme">简体中文</a>
+    <a href="https://github.com/luckdraw/lucky-canvas#readme">简体中文</a>
     ·
-    <a href="https://github.com/LuckDraw/vue-luck-draw/tree/master/en">English</a>
+    <a href="https://github.com/luckdraw/lucky-canvas/tree/master/en">English</a>
   </p>
   <p>
-    <a href="https://github.com/LuckDraw/vue-luck-draw/stargazers" target="_black">
-      <img src="https://img.shields.io/github/stars/LuckDraw/vue-luck-draw?color=%23ffca28&logo=github&style=flat-square" alt="stars" />
+    <a href="https://github.com/LuckDraw/lucky-canvas/stargazers" target="_black">
+      <img src="https://img.shields.io/github/stars/luckdraw/lucky-canvas?color=%23ffca28&logo=github&style=flat-square" alt="stars" />
     </a>
-    <a href="https://github.com/LuckDraw/vue-luck-draw/network/members" target="_black">
-      <img src="https://img.shields.io/github/forks/LuckDraw/vue-luck-draw?color=%23ffca28&logo=github&style=flat-square" alt="forks" />
+    <a href="https://github.com/luckdraw/lucky-canvas/network/members" target="_black">
+      <img src="https://img.shields.io/github/forks/luckdraw/lucky-canvas?color=%23ffca28&logo=github&style=flat-square" alt="forks" />
     </a>
-    <a href="https://www.npmjs.com/package/vue-luck-draw" target="_black">
-      <img src="https://img.shields.io/npm/v/vue-luck-draw?color=%23ffca28&logo=npm&style=flat-square" alt="version" />
+    <a href="https://www.npmjs.com/package/lucky-canvas" target="_black">
+      <img src="https://img.shields.io/npm/v/lucky-canvas?color=%23ffca28&logo=npm&style=flat-square" alt="version" />
     </a>
-    <a href="https://www.npmjs.com/package/vue-luck-draw" target="_black">
-      <img src="https://img.shields.io/npm/dm/vue-luck-draw?color=%23ffca28&logo=npm&style=flat-square" alt="downloads" />
+    <a href="https://www.npmjs.com/package/lucky-canvas" target="_black">
+      <img src="https://img.shields.io/npm/dm/lucky-canvas?color=%23ffca28&logo=npm&style=flat-square" alt="downloads" />
     </a>
-    <a href="https://www.jsdelivr.com/package/npm/vue-luck-draw" target="_black">
-      <img src="https://data.jsdelivr.com/v1/package/npm/vue-luck-draw/badge" alt="jsdelivr" />
+    <a href="https://www.jsdelivr.com/package/npm/lucky-canvas" target="_black">
+      <img src="https://data.jsdelivr.com/v1/package/npm/lucky-canvas/badge" alt="downloads" />
     </a>
   </p>
   <p>
     <a href="https://github.com/buuing" target="_black">
       <img src="https://img.shields.io/badge/Author-%20buuing%20-7289da.svg?&logo=github&style=flat-square" alt="author" />
     </a>
-    <a href="https://github.com/LuckDraw/vue-luck-draw/blob/master/LICENSE" target="_black">
-      <img src="https://img.shields.io/github/license/LuckDraw/vue-luck-draw?color=%232DCE89&logo=github&style=flat-square" alt="license" />
+    <a href="https://github.com/luckdraw/lucky-canvas/blob/master/LICENSE" target="_black">
+      <img src="https://img.shields.io/github/license/luckdraw/lucky-canvas?color=%232dce89&logo=github&style=flat-square" alt="license" />
     </a>
   </p>
 </div>
@@ -39,119 +39,38 @@
 
 ## 官方文档 & Demo演示
 
-> **中文**：[https://100px.net/usage/vue.html](https://100px.net/usage/vue.html)  
+> **中文**：[https://100px.net/usage/js.html](https://100px.net/usage/js.html)  
 
 > **English**：**If anyone can help translate the document, please contact me** `ldq404@qq.com`
 
 <br />
 
-- **在 js / jq 中使用 [lucky-canvas](https://github.com/luckdraw/lucky-canvas)**
+- **在 js / jq 中使用 [lucky-canvas](https://100px.net/usage/js.html)**
 
-- **在 vue 中使用 [vue-luck-draw](https://github.com/luckdraw/vue-luck-draw)**
+- **在 vue 中使用 [vue-luck-draw](https://100px.net/usage/vue.html)**
 
-- **在 react 中使用 [react-luck-draw](https://github.com/luckdraw/react-luck-draw)**
+- **在 react 中使用 [react-luck-draw](https://100px.net/usage/react.html)**
 
-- **在 uni-app 中使用 [uni-luck-draw](https://github.com/luckdraw/uni-luck-draw)**
+- **在 uni-app 中使用 [uni-luck-draw](https://100px.net/usage/uni-app.html)**
 
-- **在 taro 中使用 [taro-luck-draw](https://github.com/luckdraw/taro-luck-draw)**
+- **在 taro 中使用 [taro-luck-draw](https://100px.net/usage/taro.html)**
 
-- **在 微信小程序 中使用 [mini-luck-draw](https://github.com/luckdraw/mini-luck-draw)**
+- **在 微信小程序 中使用 [mini-luck-draw](https://100px.net/usage/wx.html)**
 
 <br />
 
-## 在 vue2.x / vue3.x 中使用
-
-### 方式 1：通过 import 引入
-
-1. 首先安装插件
-
-```shell
-# npm 安装：
-npm install vue-luck-draw
-
-# yarn 安装：
-yarn add vue-luck-draw
-```
-
-2. 然后找到 `main.js` 引入插件并 `use`
-
-```js
-// vue2.x
-import LuckDraw from 'vue-luck-draw'
-Vue.use(LuckDraw)
-
-// vue3.x
-import LuckDraw from 'vue-luck-draw/vue3'
-createApp(App).use(LuckDraw).mount('#app')
-```
-
-3. 最后在组件内使用 **`<LuckyWheel />`大转盘抽奖** 或 **`<LuckyGrid />`九宫格抽奖**
-
-```vue
-<template>
-  <div>
-    <!-- 大转盘抽奖 -->
-    <LuckyWheel
-      width="200px"
-      height="200px"
-      ...你的配置
-    />
-    <!-- 九宫格抽奖 -->
-    <LuckyGrid
-      width="200px"
-      height="200px"
-      ...你的配置
-    />
-  </div>
-</template>
-```
+### 贡献者
 
 <br />
 
-### 方式 2：通过 script 标签引入
-
-> 为了避免 CDN 链接出现异常或波动，我非常建议你**缓存到本地或服务器(✿◡‿◡)**
-
-- **vue2.x：** [https://cdn.jsdelivr.net/npm/vue-luck-draw@3.4/dist/vue-luck-draw.umd.min.js](https://cdn.jsdelivr.net/npm/vue-luck-draw@3.4/dist/vue-luck-draw.umd.min.js)
-
-- **vue3.x：** [https://cdn.jsdelivr.net/npm/vue-luck-draw@3.4/vue3/vue-luck-draw.umd.min.js](https://cdn.jsdelivr.net/npm/vue-luck-draw@3.4/vue3/vue-luck-draw.umd.min.js)
-
-
-```html
-<div id="app">
-  <!-- 大转盘抽奖 -->
-  <lucky-wheel
-    width="200px"
-    height="200px"
-    ...你的配置
-  />
-  <!-- 九宫格抽奖 -->
-  <lucky-grid
-    width="200px"
-    height="200px"
-    ...你的配置
-  />
-</div>
-<script src="./vue.min.js"></script>
-<script src="./vue-luck-draw.umd.min.js"></script>
-<script>
-  new Vue({
-    el: '#app',
-    data () {
-      return {}
-    }
-  })
-</script>
-```
-
-<br />
-
-### **如果您觉得这个项目还不错, 可以在 [Github](https://github.com/LuckDraw/vue-luck-draw) 上面帮我点个`star` ☜(ﾟヮﾟ☜)**
-
+### **如果您觉得这个项目还不错, 可以在 [Github](https://github.com/LuckDraw/lucky-canvas) 上面帮我点个`star` ☜(ﾟヮﾟ☜)**
 
 <br />
 
 ## 友情链接
 
 - [🎁 h5-Dooring 一款功能强大，高可扩展的H5可视化编辑器](https://github.com/MrXujiang/h5-Dooring)
 
+
+<!-- lerna过滤器配置 -->
+<!-- https://github.com/lerna/lerna/tree/main/core/filter-options#readme -->

lerna.json

@@ -0,0 +1,8 @@
+{
+  "packages": [
+    "packages/*"
+  ],
+  "version": "0.0.4",
+  "npmClient": "yarn",
+  "useWorkspaces": true
+}

logo.png

@@ -1,56 +1,23 @@
 {
-  "name": "vue-luck-draw",
-  "version": "3.4.5",
-  "description": "一个支持 vue2 / vue3 的（大转盘抽奖 / 九宫格抽奖）luckydraw 插件",
-  "main": "index.js",
-  "keywords": [
-    "vue3抽奖",
-    "大转盘抽奖",
-    "九宫格抽奖",
-    "抽奖插件",
-    "web抽奖",
-    "移动端抽奖",
-    "canvas抽奖"
-  ],
-  "author": "ldq <17778888138@189.cn>",
-  "license": "BSD-3-Clause",
-  "files": [
-    "package.json",
-    "dist",
-    "vue3",
-    "index.js",
-    "package"
-  ],
-  "scripts": {
-    "start": "yarn start:vue3",
-    "build": "yarn build:vue2 && yarn build:vue3",
-    "build:vue2": "yarn changeVue2 && yarn && yarn vue2build",
-    "build:vue3": "yarn changeVue3 &&  yarn && yarn vue3build",
-    "vue2build": "cross-env NODE_ENV=production webpack --config=build/webpack.configvue2.js",
-    "vue3build": "cross-env NODE_ENV=production webpack --config=build/webpack.configvue3.js",
-    "start:vue2": "yarn changeVue2 && yarn && yarn vue2serve",
-    "start:vue3": "yarn changeVue3 && yarn && yarn vue3serve",
-    "vue2serve": "cross-env NODE_ENV=development webpack serve --config=build/webpack.configvue2.js",
-    "vue3serve": "cross-env NODE_ENV=development webpack serve --config=build/webpack.configvue3.js",
-    "changeVue2": "node update-packge-json.js vue2",
-    "changeVue3": "node update-packge-json.js vue3"
+  "name": "lucky-canvas",
+  "devDependencies": {
+    "lerna": "^4.0.0"
   },
-  "homepage": "https://100px.net",
-  "dependencies": {
-    "lucky-canvas": "^1.5.3"
+  "scripts": {
+    "install": "lerna bootstrap",
+    "dev": "lerna exec --scope=lucky-canvas -- npm run dev",
+    "dev:vue": "",
+    "dev:react": "lerna exec dev --scope=lucky-canvas --scope=react-luck-draw -- npm run dev",
+    "dev:uni": "",
+    "dev:taro": "",
+    "dev:mini": "",
+    "build": "lerna run build --sort --stream",
+    "update-version": "lerna version --conventional-commits --no-push --no-changelog --no-git-tag-version",
+    "publish-to-npm": "lerna publish from-package",
+    "publish-beta": "lerna publish --no-git-tag-version --dist-tag beta"
   },
-  "devDependencies": {
-    "@vue/compiler-sfc": "^3.0.7",
-    "clean-webpack-plugin": "^3.0.0",
-    "copy-webpack-plugin": "^8.0.0",
-    "cross-env": "^7.0.3",
-    "file-loader": "^6.2.0",
-    "html-webpack-plugin": "^5.3.1",
-    "mini-css-extract-plugin": "^1.3.9",
-    "vue": "^3.0.7",
-    "vue-loader": "^16.1.2",
-    "webpack": "^5.27.1",
-    "webpack-cli": "^4.5.0",
-    "webpack-dev-server": "^3.11.2"
-  }
+  "private": true,
+  "workspaces": [
+    "packages/*"
+  ]
 }

package.json

@@ -0,0 +1,9 @@
+{
+  "presets": [
+    [
+      "@babel/preset-env", {
+        "modules": false
+      }
+    ]
+  ]
+}

packages/lucky-canvas/.babelrc

@@ -0,0 +1,22 @@
+module.exports = {
+  "env": {
+    "browser": true,
+    "es6": true,
+    "node": true
+  },
+  "parser": "@typescript-eslint/parser",
+  // "plugins": ['prettier'],
+  "extends": "eslint:recommended",
+  "globals": {
+    "Atomics": "readonly",
+    "SharedArrayBuffer": "readonly",
+    "ENV": true
+  },
+  "parserOptions": {
+    "ecmaVersion": 2018,
+    "sourceType": "module"
+  },
+  "rules": {
+    "linebreak-style": 'off'
+  }
+}

packages/lucky-canvas/.eslintrc.js

@@ -0,0 +1,22 @@
+.DS_Store
+node_modules
+yarn.lock
+package-lock.json
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?