periodic table pro

元素週期表PRO

高顏值的化學元素週期表工具，提供全面的元素屬性、圖片和百科知識等

簡介

元素週期表Pro 是由歡洋精心打造的原創化學元素週期表工具，採用全新的設計風格，支持Web（H5）、微信小程序、QQ 小程序和支付寶小程序等多種平台，適配不同尺寸的屏幕設備。

網站

Nextjs 構建的periodic-table-pro/website

元素週期表PRO - 高顏值化學必備小工具

小程序

Tarojs 構建的多端兼容小程序，項目目錄periodic-table-pro/weapp

微信小程序

QQ小程序

支付寶小程序

環境變量

• PLATFORM —— 代替process.env.TARO_ENV ， 在Nextjs 項目中值為next
• STATIC_BASE —— 靜態資源地址

小程序與Web 端的兼容方案簡介

該項目網站採用Nextjs, 小程序端採用Tarojs + React, 並在網站和小程序之間復用了大量的組件。

在Taro 項目中使用@tarojs/plugin-html插件將html 標籤轉譯為對應小程序的模版。

在periodic-table-pro/packages/components/compact目錄中實現了一些根據環境變量同時兼容Nextjs 與Tarojs 環境的組件和API。例如Image 、 Navigator 、 previewImage 、 navigatorTo等。

最後在需要復用的組件中使用這些兼容版的組件和API。