Refactor/create context (#294)

* chore: add `cssRemoveHoverPseudoClass` option

* refactor: getOptions

* refactor: getOptions

* chore: prepare for release

* chore: format code

* chore: init native mp

* chore(deps): add default include

.github/workflows/gh-pages.yml

@@ -23,7 +23,7 @@ jobs:
         uses: pnpm/action-setup@v2
       - uses: actions/setup-node@v3
         with:
-          node-version: 18
+          node-version: 20
           cache: pnpm
           cache-dependency-path: |
             pnpm-lock.yaml

.github/workflows/release.yml

@@ -9,6 +9,8 @@ on:
     tags:
       - 'v*'
 
+  # pnpm publish --access public --no-git-checks
+
 jobs:
   release:
     permissions:
@@ -43,7 +45,9 @@ jobs:
         run: pnpm run build
 
       - name: Publish to NPM
-        run: pnpm publish --access public --no-git-checks
+        working-directory: ./packages/weapp-tailwindcss
+        run: pnpm release
+
         env:
           NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
           NPM_CONFIG_PROVENANCE: true

.prettierrc

@@ -5,5 +5,5 @@
   "singleQuote": true,
   "endOfLine": "lf",
   "trailingComma": "none",
-  "printWidth": 180
+  "printWidth": 120
 }

CHANGELOG.md

@@ -2,6 +2,12 @@
 
 ## Unreleased
 
+## 3.2.1 (2024-5-10)
+
+### Features
+
+- 添加 `cssRemoveHoverPseudoClass` 配置，默认在小程序平台去除 `:hover` 元素
+
 ## 3.2.0 (2024-5-1)
 
 ### Features

README.md

@@ -1,4 +1,3 @@
-
 <p align="center">
 
 <a href="https://weapp-tw.icebreaker.top">
@@ -21,15 +20,15 @@
 [![test](https://github.com/sonofmagic/weapp-tailwindcss/actions/workflows/test.yml/badge.svg?branch=main)](https://github.com/sonofmagic/weapp-tailwindcss/actions/workflows/test.yml)
 [![codecov](https://codecov.io/gh/sonofmagic/weapp-tailwindcss/branch/main/graph/badge.svg?token=zn05qXYznt)](https://codecov.io/gh/sonofmagic/weapp-tailwindcss)
 
+> [!NOTE]
 > 降低开发维护成本，提升开发效率的 `小程序` `tailwindcss` 全方面解决方案
 >
-> 我的其他项目:  
 > `Tailwindcss/Unocss UI` 生成提取器: [`IceStack`](https://ui.icebreaker.top/zh-CN) 已经发布，快来用它管理你的原子化`CSS` 组件吧！
 
 \[[国内部署的文档地址](https://weapp-tw.icebreaker.top)\] \| \[[备用Github Page](https://sonofmagic.github.io/weapp-tailwindcss/)\] \| \[[1.x文档]('./v1.md')\]
 
 - [特性](#特性)
-  - [插件介绍](#插件介绍)
+- [版本对应](#版本对应)
 - [安装与使用方式](#安装与使用方式)
 - [生态和解决方案](#生态和解决方案)
 - [常见问题](#常见问题)
@@ -42,7 +41,8 @@
 - [License](#license)
 - [Star History](#star-history)
 - [Related projects](#related-projects)
-  - [CLI 工具](#cli-工具)
+  - [IceStack](#icestack)
+  - [weapp-ide-cli](#weapp-ide-cli)
   - [weapp-pandacss](#weapp-pandacss)
 
 ## 特性
@@ -51,19 +51,15 @@
 | --------------------------------------------------- | ----------------------------------------------- |
 | ![wepback+vite+gulp](./assets/weapp-tw-plugins.png) | ![frameworks](./assets/weapp-tw-frameworks.png) |
 
-核心插件支持 `webpack`/`vite`/`gulp`进行打包，涵盖了市面上几乎所有的主流开发小程序的框架。
-
-这些插件能够自动识别并精确处理所有 `tailwindcss` 的工具类来适配小程序环境。同时这些插件还有对`tailwindcss`生成的工具类名，进行压缩和混淆的能力。这个能力可以缩短`css`选择器的长度，减小生成样式的体积，同时让生产环境中的类名变得不可阅读。
-
-### 插件介绍
+核心插件支持 `webpack`/`vite`/`gulp` 为基底的框架类小程序开发，涵盖了市面上几乎所有的主流的开发框架。
 
-从 `weapp-tailwindcss/webpack` 导出的`UnifiedWebpackPluginV5` 是一个核心插件，所有使用 `webpack5` 进行打包的框架都可以使用它。
+同时也支持最原生的开发者工具创建的原生小程序应用。
 
-从 `weapp-tailwindcss/vite` 导出的`UnifiedViteWeappTailwindcssPlugin` 为 `vite` 专用插件，配置项和使用方式和 `webpack` 插件是一致的。
+这些插件能够自动识别并精确处理所有 `tailwindcss` 的工具类来适配小程序环境。
 
-而我们的 `gulp` 插件方法，可以从 `weapp-tailwindcss/gulp` 导出。
+## 版本对应
 
-目前，这些插件支持最新版本的 `tailwindcss v3.x.x` 版本和 `webpack5`，`vite` 和 `gulp`。
+目前，`weapp-tailwindcss` 的 `2.x` 和 `3.x` 支持最新版本的 `tailwindcss v3.x.x` 版本和 `webpack5`，`webpack4`, `vite` 和 `gulp`。从 `3.2.0` 开始，`weapp-tailwindcss` 支持最原生的小程序开发方式。
 
 > 如果你还在使用 `tailwindcss@2` 版本，那你应该使用本插件的 `1.x`/`webpack4` 版本。另外请确保你的 `nodejs` 版本 `>=16.6.0`。目前低于 `16` 的长期维护版本(`偶数版本`) 都已经结束了生命周期，建议安装 `nodejs` 的 `LTS`版本，详见 [nodejs/release](https://github.com/nodejs/release)
 
@@ -83,11 +79,9 @@
 
 ## Tips
 
-自从 `2.3.3` 版本开始，我发布了一个额外的包叫 `weapp-tailwindcss`,它和 `weapp-tailwindcss-webpack-plugin` 代码版本完全一致，且保持发布版本的同步。以后可以都去安装 `weapp-tailwindcss` 这个包，当然现在 `weapp-tailwindcss-webpack-plugin` 这个包也不会废弃，也会时刻保持版本的同步。
+前沿阅读: [What’s Tailwind Oxide Engine? The Next Evolution of Tailwind CSS](https://medium.com/@bomber.marek/whats-tailwind-oxide-engine-the-next-evolution-of-tailwind-css-32e7ef8e19a1)
 
-为什么要这么做的原因，主要是因为 `weapp-tailwindcss-webpack-plugin` 这个名字，已经不适合描述现在这种，多插件并存的状态了，为了以后的发展改个名。
-
-前沿阅读: [What’s Tailwind Oxide Engine? The Next Evolution of Tailwind CSS](https://medium.com/@bomber.marek/whats-tailwind-oxide-engine-the-next-evolution-of-tailwind-css-32e7ef8e19a1)，未来 `tailwindcss` 会切换到这个引擎来大幅加快构建和运行速度，当然等它发布正式版本的时候，我也会尽可能第一时间去进行兼容新的引擎。
+未来 `tailwindcss@4` 会切换到这个引擎来大幅加快构建和运行速度，当然等它发布正式版本的时候，我也会尽可能第一时间去进行兼容新的引擎。
 
 ## Contribute
 
@@ -110,7 +104,11 @@
 
 ## Related projects
 
-### CLI 工具
+### IceStack
+
+[IceStack](https://github.com/sonofmagic/icestack): ❤️ IceStack, Web UI for Mobile, PC, open-source Css component library generator
+
+### weapp-ide-cli
 
 [weapp-ide-cli](https://github.com/sonofmagic/utils/tree/main/packages/weapp-ide-cli): 一个微信开发者工具命令行，快速方便的直接启动 ide 进行登录，开发，预览，上传代码等等功能。
 

apps/native/app.js

@@ -1,19 +1,74 @@
 // app.js
 App({
-  onLaunch() {
+  onLaunch: function () {
     // 展示本地存储能力
     const logs = wx.getStorageSync('logs') || []
     logs.unshift(Date.now())
     wx.setStorageSync('logs', logs)
-
     // 登录
     wx.login({
-      success: res => {
-        // 发送 res.code 到后台换取 openId, sessionKey, unionId
+      success: (res) => {}
+    })
+    // 获取用户信息
+    wx.getSetting({
+      success: (res) => {
+        if (res.authSetting['scope.userInfo']) {
+          // 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
+          wx.getUserInfo({
+            success: (res) => {
+              // 可以将 res 发送给后台解码出 unionId
+              this.globalData.userInfo = res.userInfo
+              console.log(res.userInfo)
+              // 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
+              // 所以此处加入 callback 以防止这种情况
+              if (this.userInfoReadyCallback) {
+                this.userInfoReadyCallback(res)
+              }
+            }
+          })
+        }
       }
     })
   },
+  http: function (url, data = '', method = 'GET') {
+    // 封装http请求
+    const apiUrl = 'https://wx.yogalt.com/api/' // 请求域名
+    console.log(this.globalData)
+    const currency = {
+      openid: this.globalData.openid
+    }
+    return new Promise((resolve, reject) => {
+      wx.request({
+        url: apiUrl + url,
+        data: Object.assign(currency, data),
+        method,
+        success: function (res) {
+          if (res.data.code != 200) {
+            wx.showModal({
+              title: '提示',
+              content: res.data.message,
+              success: function (res) {
+                if (res.confirm) {
+                  console.log('用户点击确定')
+                } else if (res.cancel) {
+                  console.log('用户点击取消')
+                }
+              }
+            })
+          }
+          resolve(res.data)
+        },
+        fail: function (res) {
+          reject(res)
+        },
+        complete: function () {
+          console.log('complete')
+        }
+      })
+    })
+  },
   globalData: {
-    userInfo: null
+    userInfo: null,
+    openid: null
   }
 })

apps/native/app.json

@@ -1,15 +1,47 @@
 {
   "pages": [
     "pages/index/index",
-    "pages/logs/logs"
+    "pages/list/index",
+    "pages/cart/index",
+    "pages/user/index",
+    "pages/details/index",
+    "pages/bindPhone/index",
+    "pages/coupon/index",
+    "pages/order/index",
+    "pages/addressList/index",
+    "pages/addressAdd/index",
+    "pages/orderDetails/index"
   ],
   "window": {
-    "navigationBarTextStyle": "black",
-    "navigationBarTitleText": "Weixin",
-    "navigationBarBackgroundColor": "#ffffff"
+    "backgroundTextStyle": "light",
+    "navigationBarBackgroundColor": "#fff",
+    "navigationBarTitleText": "WeChat",
+    "navigationBarTextStyle": "black"
   },
-  "style": "v2",
-  "componentFramework": "glass-easel",
-  "sitemapLocation": "sitemap.json",
-  "lazyCodeLoading": "requiredComponents"
-}
+  "tabBar": {
+    "backgroundColor": "#fff",
+    "borderStyle": "black",
+    "color": "#333",
+    "selectedColor": "#ff5f19",
+    "list": [
+      {
+        "selectedIconPath": "images/home_page_n.png",
+        "iconPath": "images/home_page_y.png",
+        "pagePath": "pages/index/index",
+        "text": "首页"
+      },
+      {
+        "selectedIconPath": "images/Shopping.png",
+        "iconPath": "images/shopping_select.png",
+        "pagePath": "pages/cart/index",
+        "text": "购物车"
+      },
+      {
+        "selectedIconPath": "images/my_y.png",
+        "iconPath": "images/my_n.png",
+        "pagePath": "pages/user/index",
+        "text": "我的"
+      }
+    ]
+  }
+}

apps/native/package.json

@@ -16,6 +16,7 @@
   },
   "devDependencies": {
     "@types/lodash": "^4.17.1",
+    "@weapp-tailwindcss/cli": "workspace:*",
     "cross-env": "^7.0.3",
     "tailwindcss": "^3.4.3",
     "weapp-tailwindcss": "workspace:*"

apps/native/pages/addressAdd/index.js

@@ -0,0 +1,89 @@
+// pages/addressAdd/index.js
+const app = getApp()
+Page({
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    region: ['广东省', '广州市', '海珠区'],
+    customItem: '全部',
+    name: '',
+    mobile: '',
+    detailed: '',
+    addressIs: true,
+    _id: null
+  },
+  bindRegionChange: function (e) {
+    console.log('picker发送选择改变，携带值为', e.detail.value)
+    console.log(e.detail.value)
+    this.setData({
+      region: e.detail.value
+    })
+  },
+  bindKeyName: function (e) {
+    this.setData({
+      name: e.detail.value
+    })
+  },
+  bindKeyMobile: function (e) {
+    this.setData({
+      mobile: e.detail.value
+    })
+  },
+  bindKeyDetailed: function (e) {
+    this.setData({
+      detailed: e.detail.value
+    })
+  },
+  submitFun: function () {},
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+    if (options.id) {
+      this.setData({
+        region: options.city.split(','),
+        name: options.name,
+        mobile: options.mobile,
+        detailed: options.detailed,
+        _id: options.id,
+        addressIs: false
+      })
+    }
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {},
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {},
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {},
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {},
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {},
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {},
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {}
+})

apps/native/pages/addressAdd/index.json

@@ -0,0 +1,3 @@
+{
+  "navigationBarTitleText": "新增地址"
+}