forked from karrot-dev/karrot-frontend
-
Notifications
You must be signed in to change notification settings - Fork 0
/
quasar.conf.js
364 lines (322 loc) · 11.3 KB
/
quasar.conf.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
/*
* This file runs in a Node context (it's NOT transpiled by Babel), so use only
* the ES6 features that are supported by your Node version. https://node.green/
*/
// Configuration for your app
// https://quasar.dev/quasar-cli/quasar-conf-js
/* eslint-env node */
const { resolve } = require('path')
const ESLintPlugin = require('eslint-webpack-plugin')
const { readFileSync, existsSync } = require('fs')
// const StyleLintPlugin = require('stylelint-webpack-plugin') TODO?
const PreloadWebpackPlugin = require('preload-webpack-plugin')
const { configure } = require('quasar/wrappers')
const webpack = require('webpack')
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
const webpackAliases = require('./webpack.aliases').resolve.alias
function getHttpsOptions () {
/* Try to set up https with your own cert for usage with mkcert
Define your cert path and filenames in a file called .env (this uses dotenv)
KEY=key.pem
CERT=cert.pem
CA=/home/tic/.local/share/mkcert/rootCA.pem
More info: https://github.com/FiloSottile/mkcert
If these are not available, fall back to making our own cert
*/
const keyFilename = process.env.KEY || resolve(__dirname, './build/dev-certs/key.pem')
const certFilename = process.env.CERT || resolve(__dirname, './build/dev-certs/cert.pem')
const caFilename = process.env.CA || resolve(__dirname, './build/dev-certs/ca.pem')
const all = [keyFilename, certFilename, caFilename]
const missing = all.filter(filename => !existsSync(filename))
if (missing.length > 0) {
console.log(`Could not find key/cert/ca files ${missing.join(', ')}, falling back to our own...`)
return true
}
console.log('Using key/cert/ca files', all.join(', '))
return {
key: readFileSync(keyFilename),
cert: readFileSync(certFilename),
ca: readFileSync(caFilename),
}
}
module.exports = configure(function (ctx) {
const { backend, proxyTable } = require('./build/config')
const dev = ctx.dev
const appEnv = {
// define the karrot environment
KARROT: {
BACKEND: backend,
THEME: process.env.KARROT_THEME,
GIT_SHA1: process.env.GIT_SHA1 || process.env.CIRCLE_SHA1,
},
NODE_DEBUG: 'false', // workaround for node-util
}
return {
// https://quasar.dev/quasar-cli/supporting-ts
supportTS: false,
// https://quasar.dev/quasar-cli/quasar-conf-js#property-htmlvariables
htmlVariables: {
title: 'Karrot - Start a group, become a community',
},
// https://quasar.dev/quasar-cli/prefetch-feature
// preFetch: true,
// app boot file (/src/boot)
// https://quasar.dev/quasar-cli/boot-files
boot: [
'compat',
'vueQuery',
'loglevel',
'pwa',
'helloDeveloper',
'addressbar-color',
'cordova',
'i18n',
'bootstrapData',
'polyfill',
'icons',
'detectMobileKeyboard',
'performance',
],
// https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css
css: [
'app.sass',
],
// https://github.com/quasarframework/quasar/tree/dev/extras
extras: [
// 'ionicons-v4',
// 'mdi-v5',
'fontawesome-v5',
// 'eva-icons',
// 'themify',
// 'line-awesome',
'roboto-font-latin-ext', // this or either 'roboto-font', NEVER both!
// 'roboto-font', // optional, you are not bound to it
'material-icons', // optional, you are not bound to it
],
// disable vendor chunk
vendor: {
disable: true,
},
// Full list of options: https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-build
build: {
// transpile: false,
// Add dependencies for transpiling with Babel (Array of string/regex)
// (from node_modules, which are by default not transpiled).
// Applies only if "transpile" is set to true.
// transpileDependencies: [],
// rtl: false, // https://quasar.dev/options/rtl-support
// preloadChunks: true,
// showProgress: false,
// gzip: true,
// analyze: true,
env: appEnv,
sourceMap: true,
// https://quasar.dev/quasar-cli/handling-webpack
chainWebpack (chain) {
const imagesRule = chain.module.rule('images')
// save loader options from quasar - returns an object like this:
/*
{
esModule: false,
limit: 10000,
name: 'img/[name].[ext]',
}
*/
const imagesRuleOptions = imagesRule.uses.entries()['url-loader'].store.get('options')
// clear all existing loaders.
// if you don't do this, the loader below will be appended to
// existing loaders of the rule.
imagesRule.uses.clear()
/* eslint-disable indent */
imagesRule
.oneOf('disableinline')
.resourceQuery(/disableinline/)
.use('url-loader')
.loader('url-loader')
.options({ ...imagesRuleOptions, limit: -1 })
.end()
.end()
.oneOf('inline') // aka default from quasar
.use('url-loader')
.loader('url-loader')
.options(imagesRuleOptions)
chain.module
.rule('i18n-resource')
.test(/\.json$/)
.include.add(resolve(__dirname, './src/locales'))
.end()
.exclude.add(resolve(__dirname, './src/locales/translationStatus.json')).end()
.type('javascript/auto')
.use('i18n-resource')
.loader('@intlify/vue-i18n-loader')
/* eslint-enable indent */
chain.resolve.alias.set('vue-i18n$', 'vue-i18n/dist/vue-i18n.runtime.esm-bundler.js')
},
// for compatibility with vue-croppa
// can be deleted once vue-croppa supports vue 3 or we don't use it anymore
// see https://github.com/zhanziyang/vue-croppa/issues/235
// also check src/boot/compat.js
vueLoaderOptions: {
compilerOptions: {
compatConfig: {
MODE: 3,
},
},
},
extendWebpack (cfg) {
cfg.plugins.push(new ESLintPlugin())
cfg.resolve.alias = {
...cfg.resolve.alias, // This adds the existing alias
...webpackAliases, // from webpack.aliases.js
}
// We're ignore the quasar-ui-qiconpicker icon sets as we don't need them all
// They are quite big, so can make some savings
// We load what we want explicitly in src/pickerIcons.js
// Check we actually ignored some, as perhaps the config breaks one day...
const ignoredIconSetResources = new Set()
cfg.plugins.push(
new webpack.IgnorePlugin({
checkResource (resource, context) {
if (context.endsWith('@quasar/quasar-ui-qiconpicker/src/components/icon-set')) {
ignoredIconSetResources.add(resource)
return true
}
return false
},
}),
)
cfg.plugins.push({
apply (compiler) {
compiler.hooks.done.tap(
'KarrotPlugin',
() => {
if (ignoredIconSetResources.size === 0) {
throw new Error('expected to ignore some icon-sets... maybe something about the library changed?')
}
},
)
},
})
cfg.plugins.push(
new PreloadWebpackPlugin({
fileWhitelist: [/\.woff?$/],
include: 'allAssets',
rel: 'prefetch',
}),
)
if (!dev) {
cfg.plugins.push(new BundleAnalyzerPlugin({
analyzerMode: ctx.mode.cordova ? 'disabled' : 'static',
reportFilename: 'bundlesize.html',
defaultSizes: 'gzip',
openAnalyzer: false,
generateStatsFile: false,
statsFilename: 'stats.json',
statsOptions: null,
logLevel: 'info',
}))
}
},
},
// Full list of options: https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-devServer
devServer: {
// PWA needs https to load the service worker
https: (ctx.dev && ctx.mode.pwa) ? getHttpsOptions() : false,
port: 8080,
open: !process.env.NO_OPEN_BROWSER, // opens browser window automatically
proxy: proxyTable,
},
// https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-framework
framework: {
iconSet: 'material-icons', // Quasar icon set
lang: 'en-US', // Quasar language pack
config: {},
// Quasar plugins
plugins: [
'Dialog',
'AppVisibility',
'Notify',
'AddressbarColor',
],
},
// animations: 'all', // --- includes all animations
// https://quasar.dev/options/animations
animations: [],
// https://quasar.dev/quasar-cli/developing-pwa/configuring-pwa
pwa: {
workboxPluginMode: 'InjectManifest',
workboxOptions: {
// All the paths that already have file hashes in them
// other files will have a ?__WB_REVISION__=<revision> parameter added to them.
// Some people say that in theory workbox can already detect the ones with the hash, but doesn't seem so.
// if you want to see the entries in the cache you can put this in a service worker debugging console:
//
// urls = (await (await caches.open((await caches.keys())[0])).keys()).map(e => e.url)
//
dontCacheBustURLsMatching: /^(css|js|img|fonts)\//,
exclude: [
// A partial solution to a more complex issue
// See https://github.com/karrot-dev/karrot-frontend/issues/2209
'index.html',
],
},
extendWebpackCustomSW (cfg) {
cfg.resolve.alias = {
...cfg.resolve.alias,
'@': resolve(__dirname, './src'),
}
},
manifest: {
name: process.env.PWA_APP_NAME || 'Karrot local dev',
short_name: process.env.PWA_APP_NAME || 'Karrot local dev',
description: 'Modern website for organization of foodsaving groups worldwide',
display: 'standalone',
orientation: 'portrait',
background_color: '#ffffff',
theme_color: '#4a3520',
icons: process.env.KARROT_THEME === 'dev'
? [
{
src: 'icons/dev.png',
sizes: '512x512',
type: 'image/png',
},
{
src: 'icons/dev.svg',
},
]
: [
{
src: 'icons/icon-128x128.png',
sizes: '128x128',
type: 'image/png',
},
{
src: 'icons/icon-192x192.png',
sizes: '192x192',
type: 'image/png',
},
{
src: 'icons/icon-256x256.png',
sizes: '256x256',
type: 'image/png',
},
{
src: 'icons/icon-384x384.png',
sizes: '384x384',
type: 'image/png',
},
{
src: 'icons/icon-512x512.png',
sizes: '512x512',
type: 'image/png',
},
],
},
},
// Full list of options: https://quasar.dev/quasar-cli/developing-cordova-apps/configuring-cordova
cordova: {
// noIosLegacyBuildFlag: true, // uncomment only if you know what you are doing
},
}
})