I’m using aurelia cli. I have some components (view and view model) that were in my project that I registered with globalResources like so:
aurelia.use.globalResources([
'resources/framework/datatable/datatable',
'resources/framework/employeeSearch/employeeSearch',
'resources/framework/geoHierarchy/geoHierarchy',
'resources/framework/multiselect/multiselect',
'resources/framework/pagination/pagination',
'resources/framework/spinner/spinner',
'resources/framework/toggle/toggle',
'resources/value-converters/dateValueConverter',
'resources/value-converters/phoneValueConverter'
]);
This works fine and I have it registered as an aurelia feature.
Now I want to move these into an npm package, publish, and install into the project. Which I did.
When I do that and point to that copy (which ultimately is now part of the vendor bundle and not the app bundle) I get the “Dynamic load not allowed” error with the loader. I’m using requireJs.
Uncaught Error: Dynamic load not allowed: @myNamespace/framework/datatable/datatable.html
at Object.load (text.js:1)
at Module. (require.js:1095)
at require.js:134
at on (require.js:517)
at Module.callPlugin (require.js:955)
at Module.fetch (require.js:824)
at Module.check (require.js:856)
at Module.enable (require.js:1176)
at Module. (require.js:999)
at require.js:134
at require.js:1189
at each (require.js:59)
at Module.emit (require.js:1188)
at Module.check (require.js:938)
at Module.enable (require.js:1176)
at Object.enable (require.js:1557)
I made sure to update my “source” property in the transpiler to enable the decorator injection syntax and I have the “text” module as part of the vendor bundle and the loader setup to use the text plugin.
Any assistance would be appreciated. Below are my aurelia.json settings
{
"name": "application",
"type": "project:application",
"bundler": {
"id": "cli",
"displayName": "Aurelia-CLI"
},
"httpProtocol": {
"id": "http1",
"displayName": "HTTP/1.1"
},
"build": {
"targets": [{
"id": "web",
"displayName": "Web",
"port": 9000,
"index": "index.html",
"baseDir": ".",
"output": "scripts"
}],
"options": {
"minify": "stage & prod",
"sourcemaps": "dev & stage",
"rev": false,
"cache": "dev & stage"
},
"bundles": [{
"name": "app-bundle.js",
"source": [
"**/*.{js,json,css,html}"
]
},
{
"name": "vendor-bundle.js",
"prepend": [
"node_modules/bluebird/js/browser/bluebird.core.js",
{
"path": "node_modules/aurelia-cli/lib/resources/scripts/configure-bluebird-no-long-stacktraces.js",
"env": "stage & prod"
},
{
"path": "node_modules/aurelia-cli/lib/resources/scripts/configure-bluebird.js",
"env": "dev"
},
"node_modules/@babel/polyfill/browser.js",
"node_modules/requirejs/require.js"
],
"dependencies": [
"jquery",
{
"name": "bootstrap",
"path": "../node_modules/bootstrap/dist",
"main": "js/bootstrap.min",
"deps": ["jquery"]
},
{
"name": "bootstrap-multiselect",
"path": "../node_modules/bootstrap-multiselect/dist",
"main": "js/bootstrap-multiselect",
"deps": ["jquery"],
"resources": [
"css/bootstrap-multiselect.css"
]
},
"aurelia-bootstrapper",
"aurelia-loader-default",
"aurelia-pal-browser",
{
"name": "aurelia-testing",
"env": "dev"
},
{
"name": "text",
"path": "../lib/text",
"main": "text"
},
"extend",
"aurelia-notification",
{
"name": "humane-js",
"path": "../node_modules/humane-js",
"main": "humane",
"resources": [
"themes/libnotify.css"
]
},
{
"name": "aurelia-plugins-cookies",
"path": "../node_modules/aurelia-plugins-cookies/dist/amd",
"main": "aurelia-plugins-cookies"
},
"moment",
{
"name": "eonasdan-bootstrap-datetimepicker",
"path": "../node_modules/eonasdan-bootstrap-datetimepicker/build",
"main": "js/bootstrap-datetimepicker.min",
"resources": [
"css/bootstrap-datetimepicker.min.css"
]
},
{
"name": "aurelia-bootstrap-datetimepicker",
"path": "../node_modules/aurelia-bootstrap-datetimepicker/dist/amd",
"main": "index",
"resources": [
"**/*.{css,html}"
]
}
]
}
],
"copyFiles": {
"node_modules/@fortawesome/fontawesome-free/webfonts/*": "@fortawesome/fontawesome-free/webfonts"
},
"loader": {
"type": "require",
"configTarget": "vendor-bundle.js",
"includeBundleMetadataInConfig": "auto",
"plugins": [{
"name": "text",
"extensions": [
".html",
".css"
],
"stub": true
}]
}
},
"platform": {
"id": "web",
"displayName": "Web",
"port": 9000,
"index": "index.html",
"baseDir": ".",
"output": "scripts"
},
"transpiler": {
"id": "babel",
"displayName": "Babel",
"fileExtension": ".js",
"options": {
"plugins": [
["@babel/plugin-proposal-decorators", { "legacy": true }],
["@babel/plugin-proposal-class-properties", { "loose": true }],
[
"@babel/plugin-transform-modules-amd",
{
"loose": true
}
]
]
},
"source": [
"node_modules/@myNamespace/framework/**/*.js",
"src/**/*.js"
]
},
"markupProcessor": {
"id": "none",
"displayName": "None",
"fileExtension": ".html",
"source": "src/**/*.html"
},
"cssProcessor": {
"id": "none",
"displayName": "None",
"fileExtension": ".css",
"source": "src/**/*.css"
},
"jsonProcessor": {
"id": "none",
"displayName": "None",
"fileExtension": ".json",
"source": "src/**/*.json"
},
"editor": {
"id": "none",
"displayName": "None"
},
"unitTestRunners": [{
"id": "none",
"displayName": "None"
}],
"integrationTestRunner": {
"id": "none",
"displayName": "None"
},
"paths": {
"root": "src",
"resources": "resources",
"elements": "resources/elements",
"attributes": "resources/attributes",
"valueConverters": "resources/value-converters",
"bindingBehaviors": "resources/binding-behaviors"
},
"packageManager": "npm"
}