Quasar的配置文件说明

Quasar的/quasar.conf.js文件配置说明

属性                类型                 描述
css	 	    		Array 	     		来自/src/css/的全局CSS/Stylus/…文件，默认包含的主题文件除外。
preFetch			Boolean	     		启用PreFetch功能.
extras	    		Array	     		从@quasar/extras包中导入什么内容。 例： [‘material-icons’, ‘roboto-font’, ‘ionicons-v4’]
vendor	    		Object	     		向vendor块添加/删除文件/第三方库： { add: […], remove: […] }.
supportIE			Boolean	     		增加IE11+支持.
htmlVariables		Object		 		添加可在index.template.html中使用的变量。
framework			Object/String		导入哪个Quasar组件/指令/插件，选择哪个Quasar语言包,使用Quasar组件的哪个Quasar图标集。
animations			Object/String		导入哪个CSS动画。 例： [‘bounceInLeft’, ‘bounceOutRight’]
devServer			Object				Webpack开发服务器选项。 根据您使用的Quasar模式覆盖某些属性，以确保正确的配置。注意：如果您要代理开发服务器（即使用云IDE），请将“public”设置为你的公共应用程序URL。
build				Object				构建配置。
sourceFiles			Object				更改应用部分的默认名称.
cordova				Object				Cordova特定配置。
capacitor			Object				Quasar CLI Capacitor特定配置。
pwa					Object				PWA特定配置。
ssr					Object				SSR特定配置.
electron			Object				Electron特定配置。

属性：framework

告诉CLI要导入的Quasar组件/指令/插件，要使用的Quasar I18n语言包，用于Quasar组件的图标集等等。

// quasar.conf.js
return {
  // a list with all options (all are optional)
  framework: {
    components: ['QBtn', 'QIcon' /* ... */],
    directives: ['TouchSwipe' /* ... */],
    plugins: ['Notify' /* ... */],

    // Quasar config
    // You'll see this mentioned for components/directives/plugins which use it
    config: { /* ... */ },

    iconSet: 'fontawesome', // requires icon library to be specified in "extras" section too,
    lang: 'de', // Tell Quasar which language pack to use for its own components

    cssAddon: true // Adds the flex responsive++ CSS classes (noticeable bump in footprint)
  }
}

自动导入功能

您还可以通过framework：{all}属性将Quasar CLI配置为自动导入正在使用的Quasar组件和指令：

// quasar.conf.js
framework: {
  // Possible values for "all":
  // * 'auto' - Auto-import needed Quasar components & directives
  //            (slightly higher compile time; next to minimum bundle size; most convenient)
  // * false  - Manually specify what to import
  //            (fastest compile time; minimum bundle size; most tedious)
  // * true   - Import everything from Quasar
  //            (not treeshaking Quasar; biggest bundle size; convenient)
  all: 'auto',
如果您设置all: 'auto'， 那么Quasar将自动为您导入组件和指令。 编译时间将略有增加，但是您无需在quasar.conf.js中指定组件和指令。 请注意，仍需要指定Quasar插件。

从@quasar/app v1.1.2（以及quasar v1.1.3 +）开始，使用自动导入功能时，您还可以配置编写组件的方式：

// quasar.conf.js
framework: {
  all: 'auto',
  autoImportComponentCase: 'pascal' // or 'kebab' (default) or 'combined'