fix(runner): 修复 common 公共样式问题，fix #8168

1.  buildNativeComp 模式下，为各组件自动引入 common 公共样式
2. 当开发者没有全局样式文件时，仍能正确引入 common 公共样式

---------

Co-authored-by: BarryYang <[email protected]>

examples/blended-taro-component/taro-project/config/index.js

@@ -13,6 +13,12 @@ const config = {
   outputRoot: 'dist',
   plugins: [path.join(process.cwd(), '/plugin-mv/index.js')],
   framework: 'react',
+  compiler: {
+    type: 'webpack5',
+    prebundle: {
+      enable: false
+    }
+  },
   mini: {
     enableSourceMap: false,
     postcss: {

examples/blended-taro-component/taro-project/package.json

@@ -20,28 +20,30 @@
   "author": "",
   "dependencies": {
     "@babel/runtime": "^7.7.7",
-    "@tarojs/cli": "3.5.7",
-    "@tarojs/components": "3.5.7",
-    "@tarojs/plugin-framework-react": "3.5.7",
-    "@tarojs/react": "3.5.7",
-    "@tarojs/runtime": "3.5.7",
-    "@tarojs/taro": "3.5.7",
+    "@tarojs/cli": "3.6.7",
+    "@tarojs/components": "3.6.7",
+    "@tarojs/helper": "3.6.7",
+    "@tarojs/plugin-framework-react": "3.6.7",
+    "@tarojs/plugin-platform-weapp": "3.6.7",
+    "@tarojs/react": "3.6.7",
+    "@tarojs/runtime": "3.6.7",
+    "@tarojs/shared": "3.6.7",
+    "@tarojs/taro": "3.6.7",
+    "@tarojs/webpack5-runner": "^3.6.7",
     "react": "^16.10.0",
     "react-dom": "^16.10.0"
   },
   "devDependencies": {
     "@babel/core": "^7.8.0",
-    "@tarojs/mini-runner": "3.5.7",
-    "@tarojs/webpack-runner": "3.5.7",
     "@types/react": "^16.0.0",
     "@types/webpack-env": "^1.13.6",
-    "babel-preset-taro": "3.5.7",
-    "eslint": "^6.8.0",
-    "eslint-config-taro": "3.5.7",
+    "babel-preset-taro": "3.6.7",
+    "eslint": "^8.12.0",
+    "eslint-config-taro": "3.6.7",
     "eslint-plugin-import": "^2.12.0",
     "eslint-plugin-react": "^7.8.2",
-    "eslint-plugin-react-hooks": "^1.6.1",
+    "eslint-plugin-react-hooks": "^4.2.0",
     "fs-extra": "^9.0.1",
-    "stylelint": "9.3.0"
+    "stylelint": "^14.4.0"
   }
 }

examples/blended-taro-component/taro-project/src/components/article/index.jsx

@@ -1,11 +1,13 @@
 import React from 'react'
 import { View, NativeSlot } from '@tarojs/components'
+import Common from '../common'
 
 export default function (props) {
   return (
     <View>
       <View>Header: <NativeSlot name='header' /></View>
       <View>Footer: <NativeSlot name='footer' /></View>
+      <Common />
     </View>
   )
 }

examples/blended-taro-component/taro-project/src/components/common/index.jsx

@@ -0,0 +1,8 @@
+import { View } from '@tarojs/components'
+import './index.scss'
+
+export default function Index () {
+  return (
+    <View className='common'>Common Style Example</View>
+  )
+}

examples/blended-taro-component/taro-project/src/components/common/index.scss

@@ -0,0 +1,6 @@
+.common {
+  height: 30px;
+  line-height: 30px;
+  color: cyan;
+  border: 1px solid cyan;
+}

examples/blended-taro-component/taro-project/src/components/picker/index.jsx

@@ -1,5 +1,6 @@
 import React from 'react'
 import { View, Button } from '@tarojs/components'
+import Common from '../common'
 
 import './index.scss'
 
@@ -11,6 +12,7 @@ export default function (props) {
         <View>PickerItem: {item}</View>
       ))}
       <Button onClick={() => props.onButtonClick()}>Click me</Button>
+      <Common />
     </View>
   )
 }

examples/blended-taro-component/taro-project/src/pages/detail/index.jsx

@@ -1,12 +1,16 @@
 import React, { Component } from 'react'
 import { View } from '@tarojs/components'
+import Common from '../../components/common'
 
 import './index.scss'
 
 export default class Index extends Component {
   render () {
     return (
-      <View className='blue'>Detail</View>
+      <View>
+        <View className='blue'>Detail</View>
+        <Common />
+      </View>
     )
   }
 }