Open JeroenVinke opened 7 years ago
This appears to be happening because of the .js extension in the main property:
{
"name": "jquery.inputmask",
"main": "index.js",
"path": "../node_modules/jquery.inputmask",
"resources": []
}
After changing index.js
to index
I did not get this error anymore
Fyi, the above config was added to aurelia.json via au import jquery.inputmask
. But I think we should add a guard for this in the bundler, not necessarily the importer
FYI, this is my current config in aurelia.json:
{
"name": "jquery.inputmask",
"main": "index",
"path": "../node_modules/jquery.inputmask",
"deps": [
"jquery"
],
"exports": "$"
}
And when I save my custom attribute where I have import 'jquery.inputmask';
I get still get the following errors when I run au run --watch, then subsequently save the file:
Starting 'writeBundles'...
Tracing resources/attributes/input-mask...
File not found or not accessible: C:/VisualStudioOnline/Sandbox/Ken/Compline.National/Compline.National.Web/src/inputmask.dependencyLib.js. Requested by C:/VisualStudioOnline/Sandbox/Ken/Compline.National/Compline.National.Web/src/resources/attributes/input-mask.js
File not found or not accessible: C:/VisualStudioOnline/Sandbox/Ken/Compline.National/Compline.National.Web/src/inputmask.js. Requested by C:/VisualStudioOnline/Sandbox/Ken/Compline.National/Compline.National.Web/src/resources/attributes/input-mask.js
File not found or not accessible: C:/VisualStudioOnline/Sandbox/Ken/Compline.National/Compline.National.Web/src/inputmask.dependencyLib.js. Requested by C:/VisualStudioOnline/Sandbox/Ken/Compline.National/Compline.National.Web/src/resources/attributes/input-mask.js
File not found or not accessible: C:/VisualStudioOnline/Sandbox/Ken/Compline.National/Compline.National.Web/src/inputmask.js. Requested by C:/VisualStudioOnline/Sandbox/Ken/Compline.National/Compline.National.Web/src/resources/attributes/input-mask.js
Writing app-bundle.js...
Finished 'writeBundles'
Starting 'reload'...
Finished 'reload'
I get still get the following errors when I run au run --watch, then subsequently save the file:
I just wanted to bump this as I am still seeing the bug behavior on subsequent builds. ...And I have removed the .js extension.
Strange. I will have another look tonight
I've been looking at the files in the dist and dist/inputmask folders. It looks like the jquery.inputmask.bundle.js is not an AMD module. But files in dist/inputmask are AMD.
What I'm trying to figure out know is how to load those in aurelia.json so I can get all the functionality.
It looks like dist/inputmask/jquery.inputmask.js requires dist/inputmask/inputmask.js. So I think dist/inputmask/jquery.inputmask.js should be the "main" entry. But I'm not sure how to configure this so that I bring in the dependencyLib and date, numeric, phone and regex extensions.
The dist/inputmask/inputmask.*.extensions.js files all seem to export "inputmaks.dependencyLib" and "inputmask". This is all very new and confusing to me.
I must be doing something wrong because I just keep getting the same errors. Here's my current config for jquery, moment (which works fine) and inputmask:
"jquery",
{
"name": "bootstrap",
"path": "../node_modules/bootstrap/dist",
"main": "js/bootstrap.min",
"deps": [
"jquery"
],
"exports": "$"
},
"moment",
{
"name": "jquery.inputmask",
"main": "jquery.inputmask",
"path": "../node_modules/jquery.inputmask/dist/inputmask",
"deps": [
"jquery"
]
}
And my custom attribute:
import {autoinject} from "aurelia-framework";
import * as $ from "jquery";
import 'jquery.inputmask';
@autoinject
export class InputMaskCustomAttribute
{
public value:string;
private $e:$;
constructor(private element:Element)
{
this.$e = $(this.element);
}
attached()
{
this.$e.on("focusout", (e:any ) =>
{
if (this.$e.inputmask("isComplete"))
{
let event = document.createEvent('Event');
event.initEvent('input', true, true);
e.target.dispatchEvent(event);
}
});
this.$e.inputmask(this.value);
}
detached()
{
this.$e.off("focusout");
this.$e.inputmask("remove");
}
}
Any idea where there is a complete reference for the aurelia.json file? It looks like the dependencies section is an abstraction that writes your loader config for you? I've tried looking at the RequireJS docs, but their configs look noting like the dependencies section.
@cosmoKenney mind if I send you a private message on Gitter?
Sure
@cosmoKenney as soon as you finished trying out the configuration we found together, could you let me know so I can convert this issue into a documentation related issue?
Is there any update on this? I'd like to use this control with Aurelia, and while I have it partially working, I'd like to take advantage of the alias:phone and alias:email which appear to require loading other resources along with the main resource. Do we have an Aurelia Attribute example?
@VagyokC4 could you provide more info, what setup you use, which resources it tries to load etc?
I'm submitting a bug report
Please tell us about your environment:
Operating System: OSX 10.x|Linux (distro)|Windows [7|8|8.1|10]
Node Version: any
NPM Version: any
Current behavior:
npm install jquery.inputmask jquery
use the following config in aurelia.json:
import 'jquery.inputmask';
au run --watch
works fine initially, and in the browserwindow.Inputmask
is availableExpected/desired behavior: