為何捐款
API 瀏覽器
升級指南
NEW!
quasar.config 檔案
使用 Vite 轉換專案至 CLI
瀏覽器相容性
支援 TypeScript
目錄結構
命令列表
CSS 預處理器
路由
Lazy Loading - Code Splitting
處理資源
啟動檔案
預先載入功能
API 代理
處理 Vite
處理 process.env
使用 Pinia 的狀態管理
使用 Vuex 的狀態管理
Linter
測試 & 稽核
開發手機應用程式
Ajax 請求
公開開發伺服器
Quasar CLI with Vite - @quasar/app-vite
Browser compatibility

In order to configure the browser compatibility for your app, you will need to edit the /quasar.config file

/quasar.config file

build: {
  target: {
    browser: [ 'es2022', 'firefox115', 'chrome115', 'safari14' ],
    node: 'node20'
  }
}

Based on the Quasar Mode that you will be using (SPA/SSR/PWA/Electron/… etc) you will have client-side files (that run in the browser) and possibly Node.js running files. This is what the two keys of target Object above are for.

Also, independent of this configuration, you need to decide if you want the module preload polyfill since all the script tags will be injected as modules. By default, the polyfill is NOT included

/quasar.config file

build: {
  polyfillModulePreload: false
}

Furthermore, based on your /postcss.config.cjs file content, your CSS will also pass through autoprefixer for which you can configure the browser levels that you are interested in

/postcss.config.cjs

require('autoprefixer')({
  overrideBrowserslist: [
    'last 4 Chrome versions',
    'last 4 Firefox versions',
    'last 4 Edge versions',
    'last 4 Safari versions',
    'last 4 Android versions',
    'last 4 ChromeAndroid versions',
    'last 4 FirefoxAndroid versions',
    'last 4 iOS versions'
  ]
})

More info on how to specify autoprefixer browser ranges: browserslist.