import js file inside .vue component loaded using httpVueLoader

Question

i want to not use webpak form my vue devlopement, so there is 2 alternative writting components as .js file or writing them as .vue file and use httpVueLaoder to load component as if they are .js file with httpvueLoader think go grate untile the time i want to use an API inside my component ther i can not get the API i have a Home.vue componet inside ther is a FormLot.vue component in witchi try to import API.js

<script>
let FormLot = window.httpVueLoader('./frontEnd/page/lot/FormLot.vue')
module.exports = {
    name:"Home",
     components: {FormLot:FormLot},
...    
};
</script>

in FormLot.vue

// _END_ is the absolut path to the site , soi can change it later
let API = import(_END_+'/api/api.js') // dont work return promise
import API from './frontEnd/api/api.js' // dont work componnet dont show at all :(

 let FormLotE1 = window.httpVueLoader(_END_+'/page/lot/FormLotE1.vue')

module.exports ={
    ...
};
</script>

API.JS

module.exports ={
   ...
};

API.JS

export default {
   ...
};

with API.js i tryed export default and module.export bothe dont work nota when using webpack API.js got been normaly imported and work fine

when reading about httpvueLoader they sait that export default dont work in .vue file , so we have to change it to module.exports =, thats is true for the .vue file,when my import .js file dont work i guess that it wos because my API.js used export default, so i changed it to module.exports — محمد ربيع الشيخة
– محمد ربيع الشيخة, Commented Feb 27, 2020 at 12:32

محمد ربيع الشيخة · Accepted Answer · 2020-02-29 02:46:27Z

1

when using import API from path httpVueLaoder dont work so i tried to do

const API= import(path)

problem witch that ,API is promise ,wich can notbe used :( using await dontsolve the problem even when using

const API = (async ()=> await import(path))()

my solution still to call import using await but not in the top of the script i call it in the mounted() function

async mounted(){

                     API = (await import(_END_+'/api/api.js')).default

    },

note that you must use .default because import return a module :) enter code here

answered Feb 29, 2020 at 2:46

محمد ربيع الشيخة

518 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

import js file inside .vue component loaded using httpVueLoader

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related