Open BloodSaint opened 8 years ago
If you provide a variable for the src
attribute then it needs to be the fully resolved file system path to the resource. For example:
var template = require('./template.marko');
var imagePath = require.resolve('src/images/picture.png');
module.exports = function(input, out) {
template.render({
image: imagePath
}, out);
};
Please let me know if that doesn't work for you.
@patrick-steele-idem I also met the same issue.
More specifically,
Firefox will not recognize CSS content: url(...);
.
So, we use <lasso-img src='...' alt='...' />
to replace <img class='...' alt='...'>
.
Our question is about the path resolution of src
attribute.
In our cases, the src
of <lasso-img/>
should be passed through a variable. I want to use global variable defined by $global{}
. So, I did some tests to adopt the global variable.
If I call it like this, it works well.
<lasso-img src="/home/ganghuang/i18n/epnportal/src/components/site-header/ebay-logo-stacked.png" alt="Brand"/>
<lasso-img src="./ebay-logo-stacked.png" alt="Brand"/>
If I call it like this, it won't work.
<lasso-img src="${component.urlPath}" alt="Brand"/>
component.js
this.urlPath = "./ebay-logo-stacked.png";
It throws an error:
TypeError: Cannot read property 'url' of undefined
at /home/ganghuang/i18n/epnportal/node_modules/lasso-image/lasso-image.js:93:61
at /home/ganghuang/i18n/epnportal/node_modules/raptor-cache/lib/Cache.js:273:24
at builderCallback (/home/ganghuang/i18n/epnportal/node_modules/raptor-cache/lib/Cache.js:131:25)
at done (/home/ganghuang/i18n/epnportal/node_modules/lasso/lib/Lasso.js:378:20)
at doLassoResource (/home/ganghuang/i18n/epnportal/node_modules/lasso/lib/Lasso.js:435:20)
at /home/ganghuang/i18n/epnportal/node_modules/lasso/lib/Lasso.js:878:21
at /home/ganghuang/i18n/epnportal/node_modules/raptor-cache/lib/Cache.js:149:30
at Object.get (/home/ganghuang/i18n/epnportal/node_modules/raptor-cache/lib/MemoryStore.js:14:16)
at getCacheEntry (/home/ganghuang/i18n/epnportal/node_modules/raptor-cache/lib/Cache.js:77:22)
at Cache._getCallback (/home/ganghuang/i18n/epnportal/node_modules/raptor-cache/lib/Cache.js:271:9)
at Cache.get (/home/ganghuang/i18n/epnportal/node_modules/raptor-cache/lib/Cache.js:291:18)
at Object.getLassoedResource (/home/ganghuang/i18n/epnportal/node_modules/lasso/lib/LassoCache.js:136:43)
at Lasso.lassoResource (/home/ganghuang/i18n/epnportal/node_modules/lasso/lib/Lasso.js:875:19)
at work (/home/ganghuang/i18n/epnportal/node_modules/lasso-image/lasso-image.js:92:38)
at parallel (/home/ganghuang/i18n/epnportal/node_modules/raptor-async/parallel.js:57:21)
at builder (/home/ganghuang/i18n/epnportal/node_modules/lasso-image/lasso-image.js:111:21)
App stopped unexpectedly
index.marko
<lasso-img src="${component.urlPath}" alt="Brand"/>
component.js
this.urlPath = "/home/ganghuang/i18n/epnportal/src/components/site-header/ebay-logo-stacked.png";
It throws an error:
Uncaught Error: Cannot find module "/home/ganghuang/i18n/epnportal/src/components/site-header/ebay-logo-stacked.png" from "/lasso-image$1.0.11"
at moduleNotFoundError (index.js:84)
at requireModule (index.js:434)
at instanceRequire (index.js:130)
at Object.exports.getImageInfo (lasso-image-browser.js:9)
at module.exports (helper-getImageInfo.js:13)
at render (index.marko.js:120)
at renderer (renderer.js:183)
at Component.js:523
at Object.batchUpdate [as _l] (update-manager.js:88)
@darrenfu Can you print out the error at this location? https://github.com/lasso-js/lasso-image/blob/master/lasso-image.js#L93
@dimichgh The case "TypeError: Cannot read property 'url' of undefined" has been fixed, because if the url is passed through a variable, the "./' means the root path of the whole project.
But if i use the right path, it still has the error: Uncaught Error: Cannot find module "....png" from "/lasso-image$1.0.11" at moduleNotFoundError (index.js:84) at requireModule (index.js:434) at instanceRequire (index.js:130) at Object.exports.getImageInfo (lasso-image-browser.js:9) at module.exports (helper-getImageInfo.js:13) at render (index.marko.js:120) at renderer (renderer.js:183) at Component.js:523 at Object.batchUpdate [as _l] (update-manager.js:88)
@dimichgh @TomHuang204 is my team member, he will provide the necessary logs.
Using Lasso with Marko + Widgets.
When I use a template data variable to define the src of an image it fails with the error:
raptor-modules-client.js:68 Uncaught Error: Cannot find module "src/images/picture.png" from "/$/lasso/$/lasso-image".
If I explicitly pass the image location into the src attribute then it succeeds and works just fine.
My current set up is basically: Parent:
Child:
Both parent and child are stateful widgets.