From 054e4db574a5b52b3771e6798b5f1815c8200523 Mon Sep 17 00:00:00 2001
From: Zakary <zakarycode@gmail.com>
Date: Thu, 16 Dec 2021 21:02:34 +0800
Subject: [PATCH] feat(components): external @tarojs/taro

---
 .../src/components/navigator/navigator.tsx            |  3 +--
 .../components/pull-to-refresh/pull-to-refresh.tsx    |  3 +--
 .../taro-components/src/components/tabbar/tabbar.tsx  |  3 +--
 packages/taro-components/stencil.config.ts            | 11 +++++++++++
 .../virtual-list/react/createListComponent.js         |  3 +--
 5 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/packages/taro-components/src/components/navigator/navigator.tsx b/packages/taro-components/src/components/navigator/navigator.tsx
index 3b538607f9ae..eb7c21ce8088 100644
--- a/packages/taro-components/src/components/navigator/navigator.tsx
+++ b/packages/taro-components/src/components/navigator/navigator.tsx
@@ -1,8 +1,7 @@
 import { Component, Prop, h, ComponentInterface, Host, Listen, Event, EventEmitter } from '@stencil/core'
+import Taro from '@tarojs/taro'
 import classNames from 'classnames'
 
-const Taro = require('@tarojs/taro')
-
 /**
  * Navigator组件参数
  * @typedef NavigatorProps
diff --git a/packages/taro-components/src/components/pull-to-refresh/pull-to-refresh.tsx b/packages/taro-components/src/components/pull-to-refresh/pull-to-refresh.tsx
index e27fcb6298ec..d8c118eed0e9 100644
--- a/packages/taro-components/src/components/pull-to-refresh/pull-to-refresh.tsx
+++ b/packages/taro-components/src/components/pull-to-refresh/pull-to-refresh.tsx
@@ -1,8 +1,7 @@
 import { Component, Prop, h, ComponentInterface, Host, State, Event, EventEmitter, Watch, Element } from '@stencil/core'
+import Taro from '@tarojs/taro'
 import classNames from 'classnames'
 
-const Taro = require('@tarojs/taro')
-
 function setTransform (nodeStyle, value) {
   nodeStyle.transform = value
   nodeStyle.webkitTransform = value
diff --git a/packages/taro-components/src/components/tabbar/tabbar.tsx b/packages/taro-components/src/components/tabbar/tabbar.tsx
index e199ee0e53f7..be71c0ef4a4f 100644
--- a/packages/taro-components/src/components/tabbar/tabbar.tsx
+++ b/packages/taro-components/src/components/tabbar/tabbar.tsx
@@ -1,12 +1,11 @@
 import { Component, Prop, h, ComponentInterface, Host, State, Event, EventEmitter, Element } from '@stencil/core'
+import Taro from '@tarojs/taro'
 import classNames from 'classnames'
 import resolvePathname from 'resolve-pathname'
 
 import { splitUrl } from '../../utils'
 import { TabbarItem } from './tabbar-item'
 
-const Taro = require('@tarojs/taro')
-
 // const removeLeadingSlash = str => str.replace(/^\.?\//, '')
 // const removeTrailingSearch = str => str.replace(/\?[\s\S]*$/, '')
 const addLeadingSlash = str => str[0] === '/' ? str : `/${str}`
diff --git a/packages/taro-components/stencil.config.ts b/packages/taro-components/stencil.config.ts
index da2b2f63c206..5f80d8d57edc 100644
--- a/packages/taro-components/stencil.config.ts
+++ b/packages/taro-components/stencil.config.ts
@@ -1,5 +1,6 @@
 import { Config } from '@stencil/core'
 import { sass } from '@stencil/sass'
+
 const { jsWithTs: tsjPreset } = require('ts-jest/presets')
 
 export const config: Config = {
@@ -50,5 +51,15 @@ export const config: Config = {
     emulate: [{
       device: 'iPhone 8'
     }]
+  },
+  rollupPlugins: {
+    after: [{
+      name: 'add-external',
+      options: opts => {
+        opts.external = ['@tarojs/taro']
+
+        return opts
+      }
+    }]
   }
 }
diff --git a/packages/taro-components/virtual-list/react/createListComponent.js b/packages/taro-components/virtual-list/react/createListComponent.js
index e845e44e40dc..19b3c73eccc1 100644
--- a/packages/taro-components/virtual-list/react/createListComponent.js
+++ b/packages/taro-components/virtual-list/react/createListComponent.js
@@ -2,13 +2,12 @@
 /* eslint-disable no-case-declarations */
 /* eslint-disable no-void */
 /* eslint-disable no-return-assign */
+import Taro from '@tarojs/taro'
 import { getRTLOffsetType } from '../domHelpers'
 import { memoizeOne } from '../memoize'
 import { createElement, PureComponent } from 'react'
 import { cancelTimeout, requestTimeout } from '../timer'
 
-const Taro = require('@tarojs/taro')
-
 const IS_SCROLLING_DEBOUNCE_INTERVAL = 200
 
 const defaultItemKey = (index) => index // In DEV mode, this Set helps us only log a warning once per component instance.