src/auto.js
function loadJSSequentially (aList, finished) {
    if (aList.length === 0) {
      console.log('Finished loadJSSequentially.')
      if (finished) {
        finished()
      }
      return
    }
    let item = aList.shift()

    let newScript = document.createElement('script')

    let url = null
    let shouldSkip = null
    let loaded = null

    if (typeof item === 'object') {
      ({ url, shouldSkip, loaded } = item)
      if (shouldSkip()) {
        console.log('Skipped loading', url)
        console.timeEnd(`\tLoading time of "${url}"\n\t`)
        if (loaded) {
          loaded()
        }
        loadJSSequentially(aList, finished)
      } else {
        newScript.onload = () => {
          console.log('Loaded:', url)
          console.timeEnd(`\tLoading time of "${url}"\n\t`)
          if (loaded) {
            loaded()
          }
          loadJSSequentially(aList, finished)
        }
      }
    } else if (typeof item === 'string') {
      url = item
      newScript.onload = () => {
        console.log('Loaded:', url)
        console.timeEnd(`\tLoading time of "${url}"\n\t`)
        loadJSSequentially(aList, finished)
      }
    }
    newScript.src = url
    document.head.appendChild(newScript)
    console.time(`\tLoading time of "${url}"\n\t`)
  }
function loadJSSequentially (aList, finished) {
    if (aList.length === 0) {
      console.log('Finished loadJSSequentially.')
      if (finished) {
        finished()
      }
      return
    }
    let item = aList.shift()

    let newScript = document.createElement('script')

    let url = null
    let shouldSkip = null
    let loaded = null

    if (typeof item === 'object') {
      ({ url, shouldSkip, loaded } = item)
      if (shouldSkip()) {
        console.log('Skipped loading', url)
        console.timeEnd(`\tLoading time of "${url}"\n\t`)
        if (loaded) {
          loaded()
        }
        loadJSSequentially(aList, finished)
      } else {
        newScript.onload = () => {
          console.log('Loaded:', url)
          console.timeEnd(`\tLoading time of "${url}"\n\t`)
          if (loaded) {
            loaded()
          }
          loadJSSequentially(aList, finished)
        }
      }
    } else if (typeof item === 'string') {
      url = item
      newScript.onload = () => {
        console.log('Loaded:', url)
        console.timeEnd(`\tLoading time of "${url}"\n\t`)
        loadJSSequentially(aList, finished)
      }
    }
    newScript.src = url
    document.head.appendChild(newScript)
    console.time(`\tLoading time of "${url}"\n\t`)
  }
function loadJSSequentially ( aList , finished ) { if ( aList . length === 0 ) { console . log ( 'Finished loadJSSequentially.' ) if ( finished ) { finished ( ) } return } let item = aList . shift ( ) let newScript = document . createElement ( 'script' ) let url = null let shouldSkip = null let loaded = null if ( typeof item === 'object' ) { ( { url , shouldSkip , loaded } = item ) if ( shouldSkip ( ) ) { console . log ( 'Skipped loading' , url ) console . timeEnd ( ` \t ${ url } \n \t ` ) if ( loaded ) { loaded ( ) } loadJSSequentially ( aList , finished ) } else { newScript . onload = ( ) => { console . log ( 'Loaded:' , url ) console . timeEnd ( ` \t ${ url } \n \t ` ) if ( loaded ) { loaded ( ) } loadJSSequentially ( aList , finished ) } } } else if ( typeof item === 'string' ) { url = item newScript . onload = ( ) => { console . log ( 'Loaded:' , url ) console . timeEnd ( ` \t ${ url } \n \t ` ) loadJSSequentially ( aList , finished ) } } newScript . src = url document . head . appendChild ( newScript ) console . time ( ` \t ${ url } \n \t ` ) }
Dynamically load a list JS files sequentially.

@param {(string|Object)[]} aList The list of JS files to load
@param {string} aList[].url The url of the JS file to load
@param {function} aList[].loaded Callback when the file is loaded
@param {function} aList[].shouldSkip Check before loading the file.
Note: if `loaded` is set, it will be called no matter this loading is skiped or not.
Skipping loading means only to skip the loading part.

@param {function} finished Callback when all files loaded

Example:
1. `loadJSSequentially([
'https://unpkg.com/vue',
'https://unpkg.com/vuefire'
], () => {
console.log('Finished loading!')
})`
2. `loadJSSequentially([
{
url: 'https://unpkg.com/vue',
shouldSkip: () => window.Vue !== undefined,
loaded: () => { console.log('Loaded Vue!') }
},
'https://unpkg.com/vuefire'
], () => {
console.log('Finished loading!')
})`
Dynamically load a list JS files sequentially .