Skip to content

Commit

Permalink
feat: True tree-shaking for Quasar -- WIP
Browse files Browse the repository at this point in the history
  • Loading branch information
@rstoenescu
rstoenescu committed Jul 5, 2018
1 parent 3ddb991 commit c4d8de6
Show file tree
Hide file tree
Showing 220 changed files with 906 additions and 713 deletions.
47 changes: 40 additions & 7 deletions build/build.transforms.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,14 @@ const
path = require('path')

const
resolve = file => path.resolve(__dirname, '..', file),
root = path.resolve(__dirname, '..'),
resolve = file => path.resolve(root, file),
{ writeFile } = require('./build.utils')

function relative (name) {
return path.relative(root, name)
}

function getWithoutExtension (filename) {
const insertionPoint = filename.lastIndexOf('.')
return filename.slice(0, insertionPoint)
Expand All @@ -32,16 +37,32 @@ function isExternalUtil (name) {
return !['escape-key', 'modal-fn', 'popup', 'sort', 'router-link', 'is', 'noop'].includes(name)
}

function addComponents (map) {
function addComponents (map, theme) {
const
currentThemeEnding = `.${theme}.`,
otherThemeEnding = `.${theme === 'mat' ? 'ios' : 'mat'}.`

glob.sync(resolve('src/components/**/Q*.js'))
.concat(glob.sync(resolve('src/components/**/Q*.vue')))
.map(relative)
.filter(file => file.indexOf('QSpinner') === -1 && file.indexOf(otherThemeEnding) === -1)
.forEach(file => {
const name = path.basename(file)
let name = path.basename(file)
if (name.indexOf(currentThemeEnding) > -1) {
name = name.replace(currentThemeEnding, '.js')
name = name.replace(currentThemeEnding, '.vue')
}
map[getWithoutExtension(name)] = file
})

map['QSpinner'] = relative(resolve('src/components/spinner/QSpinner.js'))
map['QSpinnerMat'] = relative(resolve('src/components/spinner/QSpinner.mat.js'))
map['QSpinnerIos'] = relative(resolve('src/components/spinner/QSpinner.ios.js'))
}

function addDirectives (map) {
glob.sync(resolve('src/directives/*.js'))
.map(relative)
.forEach(file => {
const name = path.basename(file)
map[camelCase(getWithoutExtension(name))] = file
Expand All @@ -50,6 +71,7 @@ function addDirectives (map) {

function addPlugins (map) {
glob.sync(resolve('src/plugins/*.js'))
.map(relative)
.forEach(file => {
const name = path.basename(file)
map[camelCase(getWithoutExtension(name))] = file
Expand All @@ -58,6 +80,7 @@ function addPlugins (map) {

function addUtils (map) {
glob.sync(resolve('src/utils/*.js'))
.map(relative)
.forEach(file => {
const name = getWithoutExtension(path.basename(file))
if (isExternalUtil(name)) {
Expand All @@ -77,13 +100,23 @@ module.exports = function (importName) {
`
}

module.exports.generate = function () {
const map = {}
function generateTheme (theme) {
const map = {
Quasar: relative(resolve('src/index.esm.js'))
}

addComponents(map)
addComponents(map, theme)
addDirectives(map)
addPlugins(map)
addUtils(map)

writeFile(resolve('dist/babel-transforms/transform-imports.js'), generateFile(map))
writeFile(
resolve(`dist/babel-transforms/imports.${theme}.js`),
generateFile(map)
)
}

module.exports.generate = function () {
generateTheme('mat')
generateTheme('ios')
}
9 changes: 5 additions & 4 deletions build/build.utils.js
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
const
fs = require('fs'),
path = require('path'),
zlib = require('zlib')
zlib = require('zlib'),
{ green, blue, red } = require('chalk')

function getSize (code) {
return (code.length / 1024).toFixed(2) + 'kb'
Expand All @@ -16,10 +17,10 @@ module.exports.createFolder = function (folder) {

module.exports.writeFile = function (dest, code, zip) {
const banner = dest.indexOf('.json') > -1
? '[json]'
? red('[json]')
: dest.indexOf('.js') > -1
? '[js] '
: '[css] '
? green('[js] ')
: blue('[css] ')

return new Promise((resolve, reject) => {
function report (extra) {
Expand Down
31 changes: 21 additions & 10 deletions build/script.build.javascript.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,14 +27,26 @@ const builds = [
{
rollup: {
input: {
input: resolve(`src/index.esm.js`)
input: resolve(`src/index.all.esm.js`)
},
output: {
file: resolve(`dist/quasar.${buildConf.themeToken}.esm.js`),
format: 'es'
}
},
build: { unminified: true }
build: { minified: true, minExt: false }
},
{
rollup: {
input: {
input: resolve(`src/index.all.common.js`)
},
output: {
file: resolve(`dist/quasar.${buildConf.themeToken}.common.js`),
format: 'cjs'
}
},
build: { minified: true, minExt: false }
},
{
rollup: {
Expand Down Expand Up @@ -80,13 +92,10 @@ const builds = [
addAssets(builds, 'i18n')
addAssets(builds, 'icons')

build(builds)
.then(() => {
require('./build.helpers').generate()
})
.then(() => {
require('./build.transforms').generate()
})
require('./build.transforms').generate()
build(builds).then(() => {
require('./build.helpers').generate()
})

/**
* Helpers
Expand Down Expand Up @@ -218,7 +227,9 @@ function buildEntry (config) {
}

return buildUtils.writeFile(
addExtension(config.rollup.output.file),
config.build.minExt !== false
? addExtension(config.rollup.output.file)
: config.rollup.output.file,
buildConf.banner + minified.code,
true
)
Expand Down
6 changes: 3 additions & 3 deletions src/body.js
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { ready } from './utils/dom'
import { setBrand } from './utils/colors'
import { isSSR } from './plugins/platform'
import { ready } from './utils/dom.js'
import { setBrand } from './utils/colors.js'
import { isSSR } from './plugins/platform.js'

function getBodyClasses ({ is, has, within }, cfg) {
const cls = [
Expand Down
114 changes: 57 additions & 57 deletions src/components.js
View file
Original file line number Diff line number Diff line change
@@ -1,57 +1,57 @@
export * from './components/action-sheet'
export * from './components/ajax-bar'
export * from './components/alert'
export * from './components/autocomplete'
export * from './components/breadcrumbs'
export * from './components/btn'
export * from './components/card'
export * from './components/carousel'
export * from './components/chat'
export * from './components/checkbox'
export * from './components/chip'
export * from './components/chips-input'
export * from './components/collapsible'
export * from './components/color'
export * from './components/context-menu'
export * from './components/datetime'
export * from './components/dialog'
export * from './components/editor'
export * from './components/fab'
export * from './components/field'
export * from './components/icon'
export * from './components/infinite-scroll'
export * from './components/inner-loading'
export * from './components/input'
export * from './components/input-frame'
export * from './components/jumbotron'
export * from './components/knob'
export * from './components/layout'
export * from './components/list'
export * from './components/modal'
export * from './components/no-ssr'
export * from './components/observables'
export * from './components/option-group'
export * from './components/pagination'
export * from './components/parallax'
export * from './components/popover'
export * from './components/progress'
export * from './components/pull-to-refresh'
export * from './components/radio'
export * from './components/range'
export * from './components/rating'
export * from './components/scroll-area'
export * from './components/search'
export * from './components/select'
export * from './components/slide-transition'
export * from './components/slider'
export * from './components/spinner'
export * from './components/stepper'
export * from './components/tab'
export * from './components/table'
export * from './components/timeline'
export * from './components/toggle'
export * from './components/toolbar'
export * from './components/tooltip'
export * from './components/tree'
export * from './components/uploader'
export * from './components/video'
export * from './components/action-sheet/index.js'
export * from './components/ajax-bar/index.js'
export * from './components/alert/index.js'
export * from './components/autocomplete/index.js'
export * from './components/breadcrumbs/index.js'
export * from './components/btn/index.js'
export * from './components/card/index.js'
export * from './components/carousel/index.js'
export * from './components/chat/index.js'
export * from './components/checkbox/index.js'
export * from './components/chip/index.js'
export * from './components/chips-input/index.js'
export * from './components/collapsible/index.js'
export * from './components/color/index.js'
export * from './components/context-menu/index.js'
export * from './components/datetime/index.js'
export * from './components/dialog/index.js'
export * from './components/editor/index.js'
export * from './components/fab/index.js'
export * from './components/field/index.js'
export * from './components/icon/index.js'
export * from './components/infinite-scroll/index.js'
export * from './components/inner-loading/index.js'
export * from './components/input/index.js'
export * from './components/input-frame/index.js'
export * from './components/jumbotron/index.js'
export * from './components/knob/index.js'
export * from './components/layout/index.js'
export * from './components/list/index.js'
export * from './components/modal/index.js'
export * from './components/no-ssr/index.js'
export * from './components/observables/index.js'
export * from './components/option-group/index.js'
export * from './components/pagination/index.js'
export * from './components/parallax/index.js'
export * from './components/popover/index.js'
export * from './components/progress/index.js'
export * from './components/pull-to-refresh/index.js'
export * from './components/radio/index.js'
export * from './components/range/index.js'
export * from './components/rating/index.js'
export * from './components/scroll-area/index.js'
export * from './components/search/index.js'
export * from './components/select/index.js'
export * from './components/slide-transition/index.js'
export * from './components/slider/index.js'
export * from './components/spinner/index.js'
export * from './components/stepper/index.js'
export * from './components/tab/index.js'
export * from './components/table/index.js'
export * from './components/timeline/index.js'
export * from './components/toggle/index.js'
export * from './components/toolbar/index.js'
export * from './components/tooltip/index.js'
export * from './components/tree/index.js'
export * from './components/uploader/index.js'
export * from './components/video/index.js'
11 changes: 7 additions & 4 deletions src/components/action-sheet/QActionSheet.js
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,10 @@
import { QModal } from '../modal'
import { QIcon } from '../icon'
import { QList, QItem, QItemSide, QItemMain, QItemSeparator } from '../list'
import { getEventKey } from '../../utils/event'
import QModal from '../modal/QModal.js'
import QIcon from '../icon/QIcon.js'
import QList from '../list/QList.js'
import QItem from '../list/QItem.js'
import QItemSide from '../list/QItemSide.js'
import QItemMain from '../list/QItemMain.js'
import { getEventKey } from '../../utils/event.js'

export default {
name: 'QActionSheet',
Expand Down
2 changes: 1 addition & 1 deletion src/components/action-sheet/index.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import QActionSheet from './QActionSheet'
import QActionSheet from './QActionSheet.js'

export {
QActionSheet
Expand Down
6 changes: 3 additions & 3 deletions src/components/ajax-bar/QAjaxBar.js
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { cssTransform } from '../../utils/dom'
import { between } from '../../utils/format'
import { isSSR } from '../../plugins/platform'
import { cssTransform } from '../../utils/dom.js'
import { between } from '../../utils/format.js'
import { isSSR } from '../../plugins/platform.js'

const
xhr = isSSR ? null : XMLHttpRequest,
Expand Down
2 changes: 1 addition & 1 deletion src/components/ajax-bar/index.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import QAjaxBar from './QAjaxBar'
import QAjaxBar from './QAjaxBar.js'

export {
QAjaxBar
Expand Down
4 changes: 2 additions & 2 deletions src/components/alert/QAlert.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { QIcon } from '../icon'
import { QBtn } from '../btn'
import QIcon from '../icon/QIcon.js'
import QBtn from '../btn/QBtn.js'

export default {
name: 'QAlert',
Expand Down
2 changes: 1 addition & 1 deletion src/components/alert/index.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import QAlert from './QAlert'
import QAlert from './QAlert.js'

export {
QAlert
Expand Down
13 changes: 7 additions & 6 deletions src/components/autocomplete/QAutocomplete.js
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,10 @@
import { width } from '../../utils/dom'
import filter from '../../utils/filter'
import uid from '../../utils/uid'
import { QPopover } from '../popover'
import { QList, QItemWrapper } from '../list'
import KeyboardSelectionMixin from '../../mixins/keyboard-selection'
import { width } from '../../utils/dom.js'
import filter from '../../utils/filter.js'
import uid from '../../utils/uid.js'
import QPopover from '../popover/QPopover.js'
import QList from '../list/QList.js'
import QItemWrapper from '../list/QItemWrapper.js'
import KeyboardSelectionMixin from '../../mixins/keyboard-selection.js'

export default {
name: 'QAutocomplete',
Expand Down
2 changes: 1 addition & 1 deletion src/components/autocomplete/index.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import QAutocomplete from './QAutocomplete'
import QAutocomplete from './QAutocomplete.js'

export {
QAutocomplete
Expand Down
2 changes: 1 addition & 1 deletion src/components/breadcrumbs/QBreadcrumbs.js
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import AlignMixin from '../../mixins/align'
import AlignMixin from '../../mixins/align.js'

export default {
name: 'QBreadcrumbs',
Expand Down
4 changes: 2 additions & 2 deletions src/components/breadcrumbs/QBreadcrumbsEl.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { QIcon } from '../icon'
import { routerLinkProps } from '../../utils/router-link'
import QIcon from '../icon/QIcon.js'
import { routerLinkProps } from '../../utils/router-link.js'

export default {
name: 'QBreadcrumbsEl',
Expand Down
4 changes: 2 additions & 2 deletions src/components/breadcrumbs/index.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import QBreadcrumbs from './QBreadcrumbs'
import QBreadcrumbsEl from './QBreadcrumbsEl'
import QBreadcrumbs from './QBreadcrumbs.js'
import QBreadcrumbsEl from './QBreadcrumbsEl.js'

export {
QBreadcrumbs,
Expand Down
Loading

0 comments on commit c4d8de6

Please sign in to comment.