fix(runtime-build) 修复运行打包构建产物缺少组件问题 (#250)

2023-05-21 18:14:40 -07:00 · 2023-05-21 18:14:40 -07:00 · 0e095efd32
parent b5ee981110
commit 0e095efd32
6 changed files with 353 additions and 367 deletions
--- a/internals/cli/src/commands/build/build-entry-app.ts
+++ b/internals/cli/src/commands/build/build-entry-app.ts
@ -20,12 +20,12 @@ const MAIN_TEMPLATE = `{{{include}}}

 export default {
  {{{components}}}
-}
+ }
 `

 const buildFullRuntime = () => {
  const outputPath = utils.pathFromWorkspaceRoot(outputDir, 'app.ts')
-  const components = moduleUtils.getComponents()
+  const components = moduleUtils.getComponents('pc')
  const includeTemplate: string[] = []
  const componentsTemplate: string[] = []

--- a/internals/cli/src/commands/build/build-runtime.ts
+++ b/internals/cli/src/commands/build/build-runtime.ts
@ -104,6 +104,7 @@ async function batchBuildAll({ vueVersion, tasks, message, emptyOutDir, npmScope
        },
        lib: {
          entry,
+          formats: ['es'],
          fileName: (format, entryName) => `${entryName}${min ? '.min' : ''}.${format === 'es' ? 'm' : ''}js`,
          name: 'Tiny'
        },
@ -116,10 +117,6 @@ async function batchBuildAll({ vueVersion, tasks, message, emptyOutDir, npmScope
 function getEntryTasks() {
  // 每次都要构建app和图标2个runtime
  return [
-    {
-      path: 'vue/app.ts',
-      libPath: 'tiny-vue'
-    },
    {
      path: 'vue-icon/index.ts',
      libPath: 'tiny-vue-icon'
@ -131,6 +128,10 @@ function getEntryTasks() {
    {
      path: 'vue-common/src/index.ts',
      libPath: 'tiny-vue-common'
+    },
+    {
+      path: 'vue/app.ts',
+      libPath: 'tiny-vue'
    }
  ]
 }
--- a/internals/cli/src/commands/build/build-ui.ts
+++ b/internals/cli/src/commands/build/build-ui.ts
@ -91,7 +91,7 @@ export const getBaseConfig = ({ vueVersion, dtsInclude, dts, buildTarget, themeV
          }
        }
      }),
-      inlineChunksPlugin({ deleteInlinedFiles: true }),
+      !isRuntime && inlineChunksPlugin({ deleteInlinedFiles: true }),
      !isRuntime &&
      generatePackageJsonPlugin({
        beforeWriteFile: (filePath, content) => {
@ -144,7 +144,7 @@ export const getBaseConfig = ({ vueVersion, dtsInclude, dts, buildTarget, themeV
          }
        }
      }),
-      replaceModuleNamePlugin()
+      !isRuntime && replaceModuleNamePlugin()
    ],
    resolve: {
      extensions: ['.js', '.ts', '.tsx', '.vue'],
--- a/internals/cli/src/commands/create/create-mapping.ts
+++ b/internals/cli/src/commands/create/create-mapping.ts
@ -1,4 +1,5 @@
 import path from 'node:path'
+import fs from 'fs-extra'
 import * as utils from '../../shared/utils'
 import { writeModuleMap, quickSort } from '../../shared/module-utils'
 import commonMapping from './commonMapping.json'
@ -32,12 +33,10 @@ const getTemplateName = (currentPaths, entryObj) => {
  return `${currentPaths.split('-').map(utils.capitalize).join('')}${subFix}`
 }

-interface BuildEntryType {
-  path: string
-  // type为三种 component：组件入口，template：组件模板（pc|mobile|mobile-first），module:单独的模块（icon|common|local）
-  type: 'component' | 'template' | 'module'
-  exclude: boolean
-  mode?: string[]
+const tempMap = {
+  'pc.vue': 'pc',
+  'mobile.vue': 'mobile',
+  'mobile-first.vue': 'mobile-first',
 }

 /**
@ -58,6 +57,18 @@ const makeModules = () => {
    callback({ file, subPath, dirs }) {
      // 判断是否是需要作为打包入口文件
      const entryObj = getBuildEntryFile(file, dirs, subPath)
+      const mode: string[] = []
+
+      if (entryObj.isMainEntry && dirs.includes('src')) {
+        const srcPath = subPath.replace(file, 'src')
+        const srcFiles = fs.readdirSync(srcPath) || []
+        srcFiles.forEach(item => {
+          if (tempMap[item]) {
+            mode.push(tempMap[item])
+          }
+        })
+      }
+
      if (entryObj.isBuildEntryFile) {
        const modulePath = subPath.slice(subPath.lastIndexOf(`vue${path.sep}src`)).replaceAll(path.sep, '/')
        const matchArr = modulePath.match(/.+\/(.+?)\/(index\.ts|src\/pc\.|src\/mobile\.|src\/mobile-first\.)/)
@ -68,6 +79,10 @@ const makeModules = () => {
            type: entryObj.isMainEntry ? 'component' : 'template',
            exclude: false
          }
+
+          if (mode.length > 0) {
+            templates[compName].mode = mode
+          }
        }
      }
    }
@ -75,23 +90,6 @@ const makeModules = () => {

  const modulesJson = quickSort({ sortData: templates, returnType: 'object' })

-  Object.entries(modulesJson).forEach(([key, value]) => {
-    if ((value as BuildEntryType).type === 'component') {
-      const mode: string[] = []
-      const compTempCol = ['Pc', 'Mobile', 'MobileFirst']
-      compTempCol.forEach(item => {
-        if (modulesJson[key + item]) {
-          // 放入modules.json之前，转为小写
-          const modeName = item === 'MobileFirst' ? 'mobile-first' : item.toLowerCase()
-          mode.push(modeName)
-        }
-      })
-      if (mode.length) {
-        (value as BuildEntryType).mode = mode
-      }
-    }
-  })
-
  writeModuleMap(modulesJson)
 }

--- a/packages/modules.json
+++ b/packages/modules.json
--- a/packages/vue/mobile-first.ts
+++ b/packages/vue/mobile-first.ts
@ -1,11 +1,6 @@
-import ActionMenu from '@opentiny/vue-action-menu'
 import ActionSheet from '@opentiny/vue-action-sheet'
 import Alert from '@opentiny/vue-alert'
-import Amount from '@opentiny/vue-amount'
-import Anchor from '@opentiny/vue-anchor'
-import Area from '@opentiny/vue-area'
 import AutonaviMap from '@opentiny/vue-autonavi-map'
-import Avatar from '@opentiny/vue-avatar'
 import Badge from '@opentiny/vue-badge'
 import BaiduMap from '@opentiny/vue-baidu-map'
 import Button from '@opentiny/vue-button'
@ -15,8 +10,6 @@ import CardGroup from '@opentiny/vue-card-group'
 import Carousel from '@opentiny/vue-carousel'
 import CarouselItem from '@opentiny/vue-carousel-item'
 import CascaderMenu from '@opentiny/vue-cascader-menu'
-import CascaderNode from '@opentiny/vue-cascader-node'
-import CascaderPanel from '@opentiny/vue-cascader-panel'
 import CascaderSelect from '@opentiny/vue-cascader-select'
 import Cell from '@opentiny/vue-cell'
 import Chart from '@opentiny/vue-chart'
@ -45,16 +38,10 @@ import Checkbox from '@opentiny/vue-checkbox'
 import CheckboxGroup from '@opentiny/vue-checkbox-group'
 import Collapse from '@opentiny/vue-collapse'
 import CollapseItem from '@opentiny/vue-collapse-item'
-import CollapseTransition from '@opentiny/vue-collapse-transition'
 import ColumnListGroup from '@opentiny/vue-column-list-group'
 import ColumnListItem from '@opentiny/vue-column-list-item'
 import ConfigProvider from '@opentiny/vue-config-provider'
-import Crop from '@opentiny/vue-crop'
-import DatePanel from '@opentiny/vue-date-panel'
-import DatePicker from '@opentiny/vue-date-picker'
 import DatePickerMobileFirst from '@opentiny/vue-date-picker-mobile-first'
-import DateRange from '@opentiny/vue-date-range'
-import DateTable from '@opentiny/vue-date-table'
 import Drawer from '@opentiny/vue-drawer'
 import Dropdown from '@opentiny/vue-dropdown'
 import DropdownItem from '@opentiny/vue-dropdown-item'
@ -63,12 +50,9 @@ import Exception from '@opentiny/vue-exception'
 import FileUpload from '@opentiny/vue-file-upload'
 import Filter from '@opentiny/vue-filter'
 import FilterBar from '@opentiny/vue-filter-bar'
-import FilterBox from '@opentiny/vue-filter-box'
-import FilterPanel from '@opentiny/vue-filter-panel'
 import Flowchart from '@opentiny/vue-flowchart'
 import Form from '@opentiny/vue-form'
 import FormItem from '@opentiny/vue-form-item'
-import Fullscreen from '@opentiny/vue-fullscreen'
 import Grid from '@opentiny/vue-grid'
 import GridColumn from '@opentiny/vue-grid-column'
 import GridManager from '@opentiny/vue-grid-manager'
@ -77,35 +61,20 @@ import Image from '@opentiny/vue-image'
 import ImageViewer from '@opentiny/vue-image-viewer'
 import IndexBarAnchor from '@opentiny/vue-index-bar-anchor'
 import Input from '@opentiny/vue-input'
-import List from '@opentiny/vue-list'
 import Loading from '@opentiny/vue-loading'
-import Locales from '@opentiny/vue-locales'
-import LogonUser from '@opentiny/vue-logon-user'
 import Message from '@opentiny/vue-message'
-import MiniPicker from '@opentiny/vue-mini-picker'
 import Modal from '@opentiny/vue-modal'
-import MonthRange from '@opentiny/vue-month-range'
-import MonthTable from '@opentiny/vue-month-table'
-import NavBar from '@opentiny/vue-nav-bar'
-import Notify from '@opentiny/vue-notify'
 import Numeric from '@opentiny/vue-numeric'
-import Option from '@opentiny/vue-option'
-import OptionGroup from '@opentiny/vue-option-group'
 import Pager from '@opentiny/vue-pager'
 import PagerItem from '@opentiny/vue-pager-item'
-import Picker from '@opentiny/vue-picker'
-import PickerColumn from '@opentiny/vue-picker-column'
 import Popconfirm from '@opentiny/vue-popconfirm'
 import Popover from '@opentiny/vue-popover'
-import Popup from '@opentiny/vue-popup'
 import Progress from '@opentiny/vue-progress'
-import PullRefresh from '@opentiny/vue-pull-refresh'
 import Radio from '@opentiny/vue-radio'
 import RadioButton from '@opentiny/vue-radio-button'
 import RadioGroup from '@opentiny/vue-radio-group'
 import Rate from '@opentiny/vue-rate'
 import Record from '@opentiny/vue-record'
-import Scrollbar from '@opentiny/vue-scrollbar'
 import Search from '@opentiny/vue-search'
 import SelectMobile from '@opentiny/vue-select-mobile'
 import SelectView from '@opentiny/vue-select-view'
@ -113,43 +82,25 @@ import SelectedBox from '@opentiny/vue-selected-box'
 import Slider from '@opentiny/vue-slider'
 import StandardListItem from '@opentiny/vue-standard-list-item'
 import Steps from '@opentiny/vue-steps'
-import SvgIcon from '@opentiny/vue-svg-icon'
 import Switch from '@opentiny/vue-switch'
 import TabItem from '@opentiny/vue-tab-item'
-import Tabbar from '@opentiny/vue-tabbar'
-import TabbarItem from '@opentiny/vue-tabbar-item'
 import Tabs from '@opentiny/vue-tabs'
 import Tag from '@opentiny/vue-tag'
 import TagGroup from '@opentiny/vue-tag-group'
-import Time from '@opentiny/vue-time'
 import TimeLine from '@opentiny/vue-time-line'
-import TimePanel from '@opentiny/vue-time-panel'
 import TimePickerMobile from '@opentiny/vue-time-picker-mobile'
-import TimeRange from '@opentiny/vue-time-range'
-import TimeSelect from '@opentiny/vue-time-select'
-import TimeSpinner from '@opentiny/vue-time-spinner'
 import Tooltip from '@opentiny/vue-tooltip'
-import TransferPanel from '@opentiny/vue-transfer-panel'
-import TreeMenu from '@opentiny/vue-tree-menu'
 import Upload from '@opentiny/vue-upload'
 import UploadDragger from '@opentiny/vue-upload-dragger'
 import UploadList from '@opentiny/vue-upload-list'
 import UserHead from '@opentiny/vue-user-head'
 import UserHeadGroup from '@opentiny/vue-user-head-group'
-import Wheel from '@opentiny/vue-wheel'
-import YearRange from '@opentiny/vue-year-range'
-import YearTable from '@opentiny/vue-year-table'
 import { $prefix } from '@opentiny/vue-common'

 const components = [
-  ActionMenu,
  ActionSheet,
  Alert,
-  Amount,
-  Anchor,
-  Area,
  AutonaviMap,
-  Avatar,
  Badge,
  BaiduMap,
  Button,
@ -159,8 +110,6 @@ const components = [
  Carousel,
  CarouselItem,
  CascaderMenu,
-  CascaderNode,
-  CascaderPanel,
  CascaderSelect,
  Cell,
  Chart,
@ -189,16 +138,10 @@ const components = [
  CheckboxGroup,
  Collapse,
  CollapseItem,
-  CollapseTransition,
  ColumnListGroup,
  ColumnListItem,
  ConfigProvider,
-  Crop,
-  DatePanel,
-  DatePicker,
  DatePickerMobileFirst,
-  DateRange,
-  DateTable,
  Drawer,
  Dropdown,
  DropdownItem,
@ -207,12 +150,9 @@ const components = [
  FileUpload,
  Filter,
  FilterBar,
-  FilterBox,
-  FilterPanel,
  Flowchart,
  Form,
  FormItem,
-  Fullscreen,
  Grid,
  GridColumn,
  GridManager,
@ -221,35 +161,20 @@ const components = [
  ImageViewer,
  IndexBarAnchor,
  Input,
-  List,
  Loading,
-  Locales,
-  LogonUser,
  Message,
-  MiniPicker,
  Modal,
-  MonthRange,
-  MonthTable,
-  NavBar,
-  Notify,
  Numeric,
-  Option,
-  OptionGroup,
  Pager,
  PagerItem,
-  Picker,
-  PickerColumn,
  Popconfirm,
  Popover,
-  Popup,
  Progress,
-  PullRefresh,
  Radio,
  RadioButton,
  RadioGroup,
  Rate,
  Record,
-  Scrollbar,
  Search,
  SelectMobile,
  SelectView,
@ -257,32 +182,19 @@ const components = [
  Slider,
  StandardListItem,
  Steps,
-  SvgIcon,
  Switch,
  TabItem,
-  Tabbar,
-  TabbarItem,
  Tabs,
  Tag,
  TagGroup,
-  Time,
  TimeLine,
-  TimePanel,
  TimePickerMobile,
-  TimeRange,
-  TimeSelect,
-  TimeSpinner,
  Tooltip,
-  TransferPanel,
-  TreeMenu,
  Upload,
  UploadDragger,
  UploadList,
  UserHead,
-  UserHeadGroup,
-  Wheel,
-  YearRange,
-  YearTable
+  UserHeadGroup
 ]

 export const install = (app, opts = {}) => {
@ -308,14 +220,9 @@ export const install = (app, opts = {}) => {
 export const version = '3.8.1'

 export {
-  ActionMenu,
  ActionSheet,
  Alert,
-  Amount,
-  Anchor,
-  Area,
  AutonaviMap,
-  Avatar,
  Badge,
  BaiduMap,
  Button,
@ -325,8 +232,6 @@ export {
  Carousel,
  CarouselItem,
  CascaderMenu,
-  CascaderNode,
-  CascaderPanel,
  CascaderSelect,
  Cell,
  Chart,
@ -355,16 +260,10 @@ export {
  CheckboxGroup,
  Collapse,
  CollapseItem,
-  CollapseTransition,
  ColumnListGroup,
  ColumnListItem,
  ConfigProvider,
-  Crop,
-  DatePanel,
-  DatePicker,
  DatePickerMobileFirst,
-  DateRange,
-  DateTable,
  Drawer,
  Dropdown,
  DropdownItem,
@ -373,12 +272,9 @@ export {
  FileUpload,
  Filter,
  FilterBar,
-  FilterBox,
-  FilterPanel,
  Flowchart,
  Form,
  FormItem,
-  Fullscreen,
  Grid,
  GridColumn,
  GridManager,
@ -387,35 +283,20 @@ export {
  ImageViewer,
  IndexBarAnchor,
  Input,
-  List,
  Loading,
-  Locales,
-  LogonUser,
  Message,
-  MiniPicker,
  Modal,
-  MonthRange,
-  MonthTable,
-  NavBar,
-  Notify,
  Numeric,
-  Option,
-  OptionGroup,
  Pager,
  PagerItem,
-  Picker,
-  PickerColumn,
  Popconfirm,
  Popover,
-  Popup,
  Progress,
-  PullRefresh,
  Radio,
  RadioButton,
  RadioGroup,
  Rate,
  Record,
-  Scrollbar,
  Search,
  SelectMobile,
  SelectView,
@ -423,43 +304,25 @@ export {
  Slider,
  StandardListItem,
  Steps,
-  SvgIcon,
  Switch,
  TabItem,
-  Tabbar,
-  TabbarItem,
  Tabs,
  Tag,
  TagGroup,
-  Time,
  TimeLine,
-  TimePanel,
  TimePickerMobile,
-  TimeRange,
-  TimeSelect,
-  TimeSpinner,
  Tooltip,
-  TransferPanel,
-  TreeMenu,
  Upload,
  UploadDragger,
  UploadList,
  UserHead,
-  UserHeadGroup,
-  Wheel,
-  YearRange,
-  YearTable
+  UserHeadGroup
 }

 export default {
-  ActionMenu,
  ActionSheet,
  Alert,
-  Amount,
-  Anchor,
-  Area,
  AutonaviMap,
-  Avatar,
  Badge,
  BaiduMap,
  Button,
@ -469,8 +332,6 @@ export default {
  Carousel,
  CarouselItem,
  CascaderMenu,
-  CascaderNode,
-  CascaderPanel,
  CascaderSelect,
  Cell,
  Chart,
@ -499,16 +360,10 @@ export default {
  CheckboxGroup,
  Collapse,
  CollapseItem,
-  CollapseTransition,
  ColumnListGroup,
  ColumnListItem,
  ConfigProvider,
-  Crop,
-  DatePanel,
-  DatePicker,
  DatePickerMobileFirst,
-  DateRange,
-  DateTable,
  Drawer,
  Dropdown,
  DropdownItem,
@ -517,12 +372,9 @@ export default {
  FileUpload,
  Filter,
  FilterBar,
-  FilterBox,
-  FilterPanel,
  Flowchart,
  Form,
  FormItem,
-  Fullscreen,
  Grid,
  GridColumn,
  GridManager,
@ -531,35 +383,20 @@ export default {
  ImageViewer,
  IndexBarAnchor,
  Input,
-  List,
  Loading,
-  Locales,
-  LogonUser,
  Message,
-  MiniPicker,
  Modal,
-  MonthRange,
-  MonthTable,
-  NavBar,
-  Notify,
  Numeric,
-  Option,
-  OptionGroup,
  Pager,
  PagerItem,
-  Picker,
-  PickerColumn,
  Popconfirm,
  Popover,
-  Popup,
  Progress,
-  PullRefresh,
  Radio,
  RadioButton,
  RadioGroup,
  Rate,
  Record,
-  Scrollbar,
  Search,
  SelectMobile,
  SelectView,
@ -567,31 +404,18 @@ export default {
  Slider,
  StandardListItem,
  Steps,
-  SvgIcon,
  Switch,
  TabItem,
-  Tabbar,
-  TabbarItem,
  Tabs,
  Tag,
  TagGroup,
-  Time,
  TimeLine,
-  TimePanel,
  TimePickerMobile,
-  TimeRange,
-  TimeSelect,
-  TimeSpinner,
  Tooltip,
-  TransferPanel,
-  TreeMenu,
  Upload,
  UploadDragger,
  UploadList,
  UserHead,
  UserHeadGroup,
-  Wheel,
-  YearRange,
-  YearTable,
  install
 }