MorJS web - Web 編譯配置

2024-01-13 23:16 更新
  • 類型: object
  • 默認(rèn)值: {}

Web 編譯配置, 僅在 target 值為 web 時生效。

/* 配置示例 */
{
  web: {
    // 配置小程序組件名映射表
    // 默認(rèn)無需配置, 可指定全局組件配置文件
    globalComponentsConfig: {},

    // 是否使用 rpx2rem 插件對 rpx 單位進行轉(zhuǎn)換
    // 默認(rèn)為 true
    // 優(yōu)先級低于 usePx
    needRpx: true,

    // 是否需要樣式隔離,如果開啟該功能,在編譯時會給樣式加上唯一 hash 值,用于多頁面解決樣式?jīng)_突問題
    // 默認(rèn)為 false
    styleScope: false,

    // rpx 方案的 root value。
    // 默認(rèn)是 32
    rpxRootValue: 32,

    // 默認(rèn)編譯出來的樣式會以 rem 為單位
    // 優(yōu)先級高于 needRpx
    // 配合 runtime 層提供的 setRootFontSizeForRem 方法可以實現(xiàn)移動端的響應(yīng)式。
    // 如果不想將樣式單位編譯成 rem 可以配置該對象,
    // 對象中包含一個參數(shù) ratio 用于指定 rpx 2 px 的轉(zhuǎn)換比例。
    // 如 ratio 為 1, 那么 1rpx = 1px, 如果配置 ratio 為 2, 那么 1rpx = 0.5px
    usePx: { ratio: 2 },

    // extensions 配置,用于設(shè)置接口擴展
    // 可設(shè)置多個擴展路徑,如 ['extension1', 'extension2', ['extension3', {}]]
    extensions: [],

    // 配置可開啟頁面自動響應(yīng)式(以375尺寸為準(zhǔn))
    // 換算方式為 rpxRootValue / usePx.ratio
    // 以上方默認(rèn)值為例, 如需開啟響應(yīng)式可配置為: 32 / 2 = 16 即可
    responsiveRootFontSize: undefined,

    // 是否需要在導(dǎo)航欄展示返回按鈕, 默認(rèn)為 false
    // 配置示例:
    //    true: 所有頁面均開啟
    //    false: 所有頁面均關(guān)閉
    //    []: 可通過數(shù)組配置具體需要開啟的頁面
    //    (pagePath: string) => boolean: 可通過函數(shù)來定制頁面開啟情況
    showBack: false,

    // 是否需要導(dǎo)航欄, 默認(rèn)為 true
    // 配置示例:
    //    true: 所有頁面均開啟
    //    false: 所有頁面均關(guān)閉
    //    []: 可通過數(shù)組配置具體需要開啟的頁面
    //    (pagePath: string) => boolean: 可通過函數(shù)來定制頁面開啟情況
    showHeader: true,

    // 產(chǎn)物通用路徑
    publicPath: '/',

    // 開發(fā)服務(wù)器配置
    // 詳細配置參見: https://webpack.js.org/configuration/dev-server/
    devServer: {},

    // html-webpack-plugin 插件 配置
    // 詳細配置參見: https://webpack.js.org/plugins/html-webpack-plugin/
    // 支持在數(shù)組中配置多個 html 頁面
    htmlOptions: [],

    // mini-css-extract-plugin 插件配置
    // 詳細配置參見: https://webpack.js.org/plugins/mini-css-extract-plugin/
    miniCssExtractOptions: {},

    // 行內(nèi)資源大小配置, 默認(rèn)為 8k
    inlineAssetLimit: 8192,

    // 是否自動生成 entries, 默認(rèn)均開啟
    // 如關(guān)閉, 則需要自行指定 webpack 配置的入口文件
    autoGenerateEntries: true,

    // 入口文件配置, 僅在 autoGenerateEntries 為 false 的情況下生效
    // 用于手動配置 webpack 入口文件地址
    // 若手動配置則需要用戶自行組裝頁面及引用
    entry: undefined,

    // 是否輸出中間產(chǎn)物
    emitIntermediateAssets: false,

    // 支持用戶自定義運行時的一些行為,該字段將作為 $MOR_APP_CONFIG 寫入到 window 對象中,供運行時獲取并消費
    appConfig: {
      // 用于傳遞業(yè)務(wù)對某個組件的特殊配置, 比如 map 組件傳遞 key
      components: {},

      // 用于自定義 URL 中 query 部分的 tabBarKey 的實際名稱,該 key 作用于 URL 的 query
      // 并將拿到到值,用于獲取 app.json 中的 tabbar 內(nèi)容,以此實現(xiàn)通過 URL 參數(shù)切換不同 tabbar 的功能
      customTabBarKey: 'tabBarKey',

      // 用于配置是否允許覆蓋全局對象中的方法,默認(rèn)情況下不會覆蓋 `my.xxx` 方法或?qū)傩?      // 可以通過配置為 `false` 來強制覆蓋
      apiNoConflict: true
    }
  }
}


以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號