Merge branch 'master' into docs-fetch-header

didi · Dec 5, 2023 · 4366a41 · 4366a41
2 parents f5c04bb + 980a5a8
commit 4366a41
Show file tree

Hide file tree

Showing 6 changed files with 98 additions and 85 deletions.
diff --git a/packages/unocss-plugin/lib/index.js b/packages/unocss-plugin/lib/index.js
@@ -28,9 +28,6 @@ const {
   cssRequiresTransform
 } = require('./transform')
 const platformPreflightsMap = require('./platform')
-const loadersPath = path.resolve(__dirname, './loaders')
-const transAppLoader = path.resolve(loadersPath, 'unocss-app.js')
-
 const PLUGIN_NAME = 'MpxUnocssPlugin'
 
 function filterFile (file, scan) {
@@ -241,21 +238,19 @@ class MpxUnocssPlugin {
         // todo 考虑使用options.config/configFiles读取配置对象后再与webOptions合并后传递给UnoCSSWebpackPlugin，保障读取的config对象与mp保持一致
         compiler.options.plugins.push(new UnoCSSWebpackPlugin(webOptions))
       }
-      // 给app注入unocss模块
-      compiler.options.module.rules.push({
-        test: /\.mpx$/,
-        resourceQuery: /isApp/,
-        enforce: 'pre',
-        use: [transAppLoader]
-      })
-      return
     }
-    compiler.hooks.thisCompilation.tap(PLUGIN_NAME, (compilation) => {
+    compiler.hooks.thisCompilation.tap({
+      name: PLUGIN_NAME,
+      // 确保在MpxWebpackPlugin后执行，获取完整mpx对象
+      stage: 100
+    }, (compilation) => {
+      const { __mpx__: mpx } = compilation
+      mpx.hasUnoCSS = true
+      if (mode === 'web') return
       compilation.hooks.processAssets.tapPromise({
         name: PLUGIN_NAME,
         stage: compilation.PROCESS_ASSETS_STAGE_ADDITIONS
       }, async (assets) => {
-        const { __mpx__: mpx } = compilation
         const error = (msg) => {
           compilation.errors.push(new Error(msg))
         }

diff --git a/packages/unocss-plugin/lib/loaders/unocss-app.js b/packages/unocss-plugin/lib/loaders/unocss-app.js
diff --git a/packages/webpack-plugin/lib/loader.js b/packages/webpack-plugin/lib/loader.js
@@ -222,10 +222,6 @@ module.exports = function (content) {
             output += templateRes.output
             output += stylesRes.output
             output += jsonRes.output
-            if (ctorType === 'app' && jsonRes.jsonObj.window && jsonRes.jsonObj.window.navigationBarTitleText) {
-              mpx.appTitle = jsonRes.jsonObj.window.navigationBarTitleText
-            }
-
             processScript(parts.script, {
               loaderContext,
               ctorType,

diff --git a/packages/webpack-plugin/lib/web/processMainScript.js b/packages/webpack-plugin/lib/web/processMainScript.js
@@ -1,7 +1,14 @@
 const addQuery = require('../utils/add-query')
 const normalize = require('../utils/normalize')
 const optionProcessorPath = normalize.lib('runtime/optionProcessor')
-const { buildComponentsMap, buildPagesMap, buildGlobalParams, shallowStringify, stringifyRequest, buildI18n } = require('./script-helper')
+const {
+  buildComponentsMap,
+  buildPagesMap,
+  buildGlobalParams,
+  shallowStringify,
+  stringifyRequest,
+  buildI18n
+} = require('./script-helper')
 
 module.exports = function (script, {
   loaderContext,
@@ -17,38 +24,57 @@ module.exports = function (script, {
   localPagesMap,
   resource
 }, callback) {
-  const { i18n, webConfig } = loaderContext.getMpx()
-
-  const { pagesMap, firstPage, globalTabBar } = buildPagesMap({ localPagesMap, loaderContext, tabBar, tabBarMap, tabBarStr, jsonConfig })
+  const { i18n, webConfig, hasUnoCSS } = loaderContext.getMpx()
+  const { pagesMap, firstPage, globalTabBar } = buildPagesMap({
+    localPagesMap,
+    loaderContext,
+    tabBar,
+    tabBarMap,
+    tabBarStr,
+    jsonConfig
+  })
 
   const componentsMap = buildComponentsMap({ localComponentsMap, loaderContext })
 
   const scriptSrcMode = script ? script.mode || srcMode : srcMode
 
-  let output = `\n  import { processAppOption, getComponent } from ${stringifyRequest(loaderContext, optionProcessorPath)}
-          import '@mpxjs/webpack-plugin/lib/runtime/base.styl'
-          import Vue from 'vue'
-          import VueRouter from 'vue-router'
-          import Mpx from '@mpxjs/core'
-          import App from ${stringifyRequest(loaderContext, addQuery(resource, { isApp: true }))}
-          Vue.use(VueRouter)
-  \n`
+  let output = '  import \'@mpxjs/webpack-plugin/lib/runtime/base.styl\'\n'
+  // hasUnoCSS由@mpxjs/unocss-plugin注入
+  if (hasUnoCSS) {
+    output += '  import \'uno.css\'\n'
+  }
+  output += `  import Vue from 'vue'
+  import VueRouter from 'vue-router'
+  import Mpx from '@mpxjs/core'
+  import App from ${stringifyRequest(loaderContext, addQuery(resource, { isApp: true }))}
+  import { processAppOption, getComponent } from ${stringifyRequest(loaderContext, optionProcessorPath)}
+  Vue.use(VueRouter)\n`
 
   if (i18n) {
     output += buildI18n({ i18n, loaderContext })
   }
 
-  output += buildGlobalParams({ moduleId, scriptSrcMode, loaderContext, isProduction, jsonConfig, webConfig, isMain: true, globalTabBar })
-  output += `export default processAppOption({
-                        App,
-                        tabBarMap: ${JSON.stringify(tabBarMap)},
-                        firstPage: ${JSON.stringify(firstPage)},
-                        pagesMap: ${shallowStringify(pagesMap)},
-                        componentsMap: ${shallowStringify(componentsMap)},
-                        Vue,
-                        VueRouter,
-                        webConfig: ${JSON.stringify(webConfig)}
-                    })`
+  output += buildGlobalParams({
+    moduleId,
+    scriptSrcMode,
+    loaderContext,
+    isProduction,
+    jsonConfig,
+    webConfig,
+    isMain: true,
+    globalTabBar
+  })
+  output += `
+  export default processAppOption({
+    App,
+    tabBarMap: ${JSON.stringify(tabBarMap)},
+    firstPage: ${JSON.stringify(firstPage)},
+    pagesMap: ${shallowStringify(pagesMap)},
+    componentsMap: ${shallowStringify(componentsMap)},
+    Vue,
+    VueRouter,
+    webConfig: ${JSON.stringify(webConfig)}
+  })\n`
 
   callback(null, {
     output

diff --git a/packages/webpack-plugin/lib/web/processScript.js b/packages/webpack-plugin/lib/web/processScript.js
@@ -75,7 +75,8 @@ module.exports = function (script, {
 
       content += buildGlobalParams({ moduleId, scriptSrcMode, loaderContext, isProduction })
       content += getRequireScript({ ctorType, script, loaderContext })
-      content += `  export default processComponentOption({
+      content += `
+  export default processComponentOption({
     option: global.__mpxOptionsMap[${JSON.stringify(moduleId)}],
     ctorType: ${JSON.stringify(ctorType)},
     outputPath: ${JSON.stringify(outputPath)},
@@ -85,12 +86,11 @@ module.exports = function (script, {
     componentGenerics: ${JSON.stringify(componentGenerics)},
     genericsInfo: ${JSON.stringify(genericsInfo)},
     mixin: getWxsMixin(wxsModules),
-    hasApp: ${hasApp}`
-      content += '\n  })\n'
+    hasApp: ${hasApp}
+  })\n`
       return content
     }
   })
-  output += '\n'
 
   callback(null, {
     output

diff --git a/packages/webpack-plugin/lib/web/script-helper.js b/packages/webpack-plugin/lib/web/script-helper.js
@@ -81,10 +81,11 @@ function buildPagesMap ({ localPagesMap, loaderContext, tabBar, tabBarMap, tabBa
     })
   }
   if (tabBarStr && tabBarPagesMap) {
-    globalTabBar += `  global.__tabBar = ${tabBarStr}
-                        Vue.observable(global.__tabBar)
-                        // @ts-ignore
-                        global.__tabBarPagesMap = ${shallowStringify(tabBarPagesMap)}\n`
+    globalTabBar += `
+  global.__tabBar = ${tabBarStr}
+  Vue.observable(global.__tabBar)
+  // @ts-ignore
+  global.__tabBarPagesMap = ${shallowStringify(tabBarPagesMap)}\n`
   }
   Object.keys(localPagesMap).forEach((pagePath) => {
     const pageCfg = localPagesMap[pagePath]
@@ -125,29 +126,30 @@ function getRequireScript ({ ctorType, script, loaderContext }) {
 function buildGlobalParams ({ moduleId, scriptSrcMode, loaderContext, isProduction, jsonConfig, webConfig, isMain, globalTabBar }) {
   let content = ''
   if (isMain) {
-    content += `global.getApp = function(){}
-    global.getCurrentPages = function () {
-      if (!(typeof window !== 'undefined')) {
-        console.error('[Mpx runtime error]: Dangerous API! global.getCurrentPages is running in non browser environment, It may cause some problems, please use this method with caution')
-      }
-      const router = global.__mpxRouter
-      if(!router) return []
-      // @ts-ignore
-      return (router.lastStack || router.stack).map(item => {
-        let page
-        const vnode = item.vnode
-        if (vnode && vnode.componentInstance) {
-          page = vnode.tag.endsWith('mpx-tab-bar-container') ? vnode.componentInstance.$refs.tabBarPage : vnode.componentInstance
-        }
-        return page || { route: item.path.slice(1) }
-      })
+    content += `
+  global.getApp = function(){}
+  global.getCurrentPages = function () {
+    if (!(typeof window !== 'undefined')) {
+      console.error('[Mpx runtime error]: Dangerous API! global.getCurrentPages is running in non browser environment, It may cause some problems, please use this method with caution')
     }
-    global.__networkTimeout = ${JSON.stringify(jsonConfig.networkTimeout)}
-    global.__mpxGenericsMap = {}
-    global.__mpxOptionsMap = {}
-    global.__style = ${JSON.stringify(jsonConfig.style || 'v1')}
-    global.__mpxPageConfig = ${JSON.stringify(jsonConfig.window)}
-    global.__mpxTransRpxFn = ${webConfig.transRpxFn}\n`
+    const router = global.__mpxRouter
+    if(!router) return []
+    // @ts-ignore
+    return (router.lastStack || router.stack).map(item => {
+      let page
+      const vnode = item.vnode
+      if (vnode && vnode.componentInstance) {
+        page = vnode.tag.endsWith('mpx-tab-bar-container') ? vnode.componentInstance.$refs.tabBarPage : vnode.componentInstance
+      }
+      return page || { route: item.path.slice(1) }
+    })
+  }
+  global.__networkTimeout = ${JSON.stringify(jsonConfig.networkTimeout)}
+  global.__mpxGenericsMap = {}
+  global.__mpxOptionsMap = {}
+  global.__style = ${JSON.stringify(jsonConfig.style || 'v1')}
+  global.__mpxPageConfig = ${JSON.stringify(jsonConfig.window)}
+  global.__mpxTransRpxFn = ${webConfig.transRpxFn}\n`
     if (globalTabBar) {
       content += globalTabBar
     }
@@ -164,9 +166,10 @@ function buildGlobalParams ({ moduleId, scriptSrcMode, loaderContext, isProducti
 function buildI18n ({ i18n, loaderContext }) {
   let i18nContent = ''
   const i18nObj = Object.assign({}, i18n)
-  i18nContent += `  import VueI18n from 'vue-i18n'
-          import { createI18n } from 'vue-i18n-bridge'
-          Vue.use(VueI18n , { bridge: true })\n`
+  i18nContent += `
+  import VueI18n from 'vue-i18n'
+  import { createI18n } from 'vue-i18n-bridge'
+  Vue.use(VueI18n , { bridge: true })\n`
   const requestObj = {}
   const i18nKeys = ['messages', 'dateTimeFormats', 'numberFormats']
   i18nKeys.forEach((key) => {
@@ -179,10 +182,11 @@ function buildI18n ({ i18n, loaderContext }) {
   Object.keys(requestObj).forEach((key) => {
     i18nContent += `  i18nCfg.${key} = require(${requestObj[key]})\n`
   })
-  i18nContent += '  i18nCfg.legacy = false\n'
-  i18nContent += `  const i18n = createI18n(i18nCfg, VueI18n)
-                        Vue.use(i18n)
-                        Mpx.i18n = i18n\n`
+  i18nContent += `
+  i18nCfg.legacy = false
+  const i18n = createI18n(i18nCfg, VueI18n)
+  Vue.use(i18n)
+  Mpx.i18n = i18n\n`
   return i18nContent
 }