微信小程序的ts模版項(xiàng)目中引入tdesign組件庫
1.新建ts模版的項(xiàng)目,這時(shí)項(xiàng)目詳情 / 本地設(shè)置中,調(diào)試基礎(chǔ)庫默認(rèn)值是:2.30.4,默認(rèn)也不會(huì)勾選“將js編譯成es5”,此時(shí)小程序的根目錄在miniprogram文件夾
2.cmd轉(zhuǎn)入新項(xiàng)目的miniprogram文件夾,執(zhí)行命令安裝tdesign:
npm init -y
npm i tdesign-miniprogram -S --production
如果直接在項(xiàng)目根目錄下安裝tdesign,會(huì)報(bào)錯(cuò):NPM packages not found. Please confirm npm packages which need to build are belong to `miniprogramRoot` directory
3.進(jìn)入微信開發(fā)者工具,執(zhí)行菜單:工具 / 構(gòu)建npm
4.測(cè)試tdesign組件
①加入組件引用,修改miniprogram\pages\logs\logs.json
"usingComponents": {
? ? "t-button": "tdesign-miniprogram/button/button"
? }
②調(diào)用組件,修改miniprogram\pages\logs\logs.wxml
<view>
? <t-button theme="primary" size="large" bindtap="onTabToIndex">轉(zhuǎn)去首頁</t-button>
</view>
③加入組件觸發(fā)事件,修改miniprogram\pages\logs\logs.ts
? onTabToIndex () {
? ? wx.navigateTo({
? ? ? url: '../index/index'
? ? })
? }