Parcel: Ability to include files via non-standard (A-Frame) attributes?

Created on 14 Sep 2018 · 6Comments · Source: parcel-bundler/parcel

❔ Question

Is it currently possible to include files that are referenced via non-standard HTML attributes into the bundle?

🔦 Context

I do a lot of development in A-Frame, which utilizes many non-standard attributes.

I'm trying to get files referenced by these attributes and properties included. See code sample below.

In A-Frame, many different components (attributes) utilize the src property, as well as many other properties that may accept a file path.

💻 Code Samples


<!-- As a property value of an attribute: -->
<a-entity template="src: ./templates/room.html;"></a-entity>

<a-entity template="src: ./templates/redball.template;"></a-entity>

<a-entity template="src: ./templates/cone.tpl;" data-color="red"></a-entity>

<a-entity material="src: ./textures/rocks.png;"></a-entity>

<a-mixin id="tree" template="src: ./templates/tree.html;"></a-mixin>

<!-- As an attribute value: -->
<a-asset-item id="camera" src="./templates/camera.html"></a-asset-item>

🌍 Your Environment

| Software | Version(s) |
| ---------------- | ---------- |
| Parcel | 1.9.7
| Node | 8.2.1
| npm/Yarn | npm 6.3.0
| Operating System | Windows 10

Question

Source

dsinni

👍1

Most helpful comment

Hello Dan,
I'm currently working on a POC project with Aframe / Vue.js / Parcel.
I had the same problem including obj files in my builds.

I use an import statement in a js script :

import myObject from '../assets/myObject.obj'

and use it as a source attribute in my template :

<a-asset-item id="my-object" :src="myObject"></a-asset-item>

And it works.
If not using Vue.js I would have done this by getting the element by Id and changing the src attribute I guess... not sure if that could work but maybe it can help 😅
I was wondering if you have found a prettier workaround or a solution !

GuillaumeBAECHLER on 18 May 2019

🎉2

All 6 comments

Hello. I just noticed that 1.10.0 was available and wanted to check in. Is this now possible with some configuration? I tried with default config and no luck.

Thanks for your time.

dsinni on 25 Sep 2018

Hello. It's been 6 months since I filed this issue and would really love any insight or direction on this if anyone could spare the time.

Other examples of something like this would be:

<!-- These are assets for A-Frame -->

<!-- 3D Model -->
<a-asset-item id="model" src="./assets/models/model.glb"></a-asset-item>

<!-- Audio -->
<a-asset-item id="bg-music" src="./assets/audio/bg-music.mp3"></a-asset-item>

How can I get these files included in the bundle and referenced correctly?

Since WebVR/WebXR is exploding with popularity right now, it would be great if model formats (as well as other related formats) could be supported by default: gltf, glb, obj, mtl, fbx, etc.

Thanks.

dsinni on 27 Apr 2019

Hello Dan,
I'm currently working on a POC project with Aframe / Vue.js / Parcel.
I had the same problem including obj files in my builds.

I use an import statement in a js script :

import myObject from '../assets/myObject.obj'

and use it as a source attribute in my template :

<a-asset-item id="my-object" :src="myObject"></a-asset-item>

GuillaumeBAECHLER on 18 May 2019

🎉2

I'm stuck in a similar situation, I have multiple A-Frame experiments that I'd like to turn into a website without too much hassle but parcel won't reference them correctly. Has anyone found a way to make this work?

For now I'll try converting my project to ~Vue~ React, hopefully it will work.