[Vuejs]-Is vuejs app.js import path can be dynamic or in if else condition?

0👍

You could either:

import both and do the conditional

Imagine one file with codes of projectA and projectB and conditional.

import initProjectA
import initProjectB

if (condition) {
  initProjectA()
} else {
  initProjectB()
}

this will be compiled down into something like:

function initProjectA() {
}

function initProjectB() {
}

if (condition) {
  //
}

dynamic imports:

This will produce 3 separate files: projectA, projectB, conditional.

import(module).then(importedModule => {
  importedModule.default() // assuming you did `export default`
})

conditional file will only load either one of them then execute it.

  • check if it should download projectA or projectB
  • once file is downloaded, execute it

You might have to change some configurations to be able to do dynamic imports. You can search for the topic "webpack dynamic imports" on Google.

Leave a comment