Subscribe on changes!

sfc playground - "can't access property "propertyname", __import_1__ is undefined

avatar
Jul 5th 2021

Version

3.1.4

Reproduction link

sfc-playground

Steps to reproduce

import a JS file in both the app and a child component. in the app, import the js file before importing the child component.

changing the order of import in the parent. (component first, and js file after) will work.

What is expected?

import of js file in parent and child should not result in an error based on the order of imports.

What is actually happening?

an error at the parent component. "can't access property "propertyname", import_1 is undefined

avatar
Jul 8th 2021

seem like the sfc-playground "emulated" module import and is not handled "purely" by the browser. which makes the module loading logic more complex.

if only browsers allowed imports of modules defined in inline <script name="moduleA" type=module> tags then most of the issues would probably be solved.

fixing the loading order for non circular imports should be relatively easy fix, can also be fixed by changing logic to use "lazy loading". however circular imports adds another level of complexity for emulation of imports.

code below is similar to original reproduction code, but with added complexity of circular imports. which is working here but not in the official sfc-playground.

https://sfc-vue3.netlify.app/#/gist/b2232ce520cd85bdf45cad36cbd5acf7

avatar
Sep 17th 2022

seems fixed