Aurelia 1.x Q&A - Sandbox at https://codesandbox.io/s/aurelia-javascript-sandbox-jnl6q85zq5
dependabot[bot] on npm_and_yarn
chore(deps): bump trim-off-newl… (compare)
dependabot[bot] on npm_and_yarn
chore(deps): bump tar from 4.4.… (compare)
dependabot[bot] on npm_and_yarn
chore(deps): bump trim-off-newl… (compare)
dependabot[bot] on npm_and_yarn
chore(deps): bump aurelia-frame… (compare)
dependabot[bot] on npm_and_yarn
chore(deps): bump trim-off-newl… (compare)
dependabot[bot] on npm_and_yarn
chore(deps): bump trim-off-newl… (compare)
import { singleton } from '@aurelia/kernel';
import { LoggingWinston } from '@google-cloud/logging-winston';
import { instanceCachingFactory, registry } from 'tsyringe';
import winston, { format, Logger, LoggerOptions, transports } from 'winston';
export const LoggerDefault = 'defaultLogger';
export const LoggerTypeOrm = 'typeormLogger';
export const LoggerSecurity = 'securityLogger';
export const LoggerSecurityChild = 'childSecurityLogger';
@registry([
{ token: LoggerDefault, useFactory: instanceCachingFactory(createDefaultLogger) },
{ token: LoggerTypeOrm, useFactory: instanceCachingFactory(createTypeOrmLogger) },
{ token: LoggerSecurity, useFactory: instanceCachingFactory(createSecurityLogger) },
])
export class LoggerProvider {}
export function createDefaultLogger(): Logger {
const config: LoggerOptions =
process.env['NODE_ENV'] === 'development' ? devConfig() : serverConfig();
return winston.loggers.add(LoggerDefault, config);
}
function createTypeOrmLogger(): Logger {
const config: LoggerOptions =
process.env['NODE_ENV'] === 'development' ? devConfig() : serverConfig();
return winston.loggers.add(LoggerTypeOrm, config);
}
function createSecurityLogger(): Logger {
const config: LoggerOptions =
process.env['NODE_ENV'] === 'development' ? devConfig() : googleConfig();
return winston.loggers.add(LoggerSecurity, config);
}
function devConfig(): LoggerOptions {
const console = new transports.Console({
level: process.env.LOG_LEVEL || 'info',
debugStdout: true,
format: format.combine(format.cli(), format.splat(), format.simple()),
});
return {
transports: [console],
exceptionHandlers: [console],
};
}
function googleConfig(): LoggerOptions {
return {
transports: [
new LoggingWinston({
projectId: process.env.GOOGLE_SERVICE_ACCOUNT_PROJECT_ID,
credentials: {
client_email: process.env.GOOGLE_SERVICE_ACCOUNT_CLIENT_EMAIL!,
private_key: process.env.GOOGLE_SERVICE_ACCOUNT_PRIVATE_KEY!,
},
}),
],
};
}
function serverConfig(): LoggerOptions {
return {
transports: [
new transports.Console({
level: process.env.LOG_LEVEL || 'info',
debugStdout: true,
format: format.combine(format.splat(), format.simple()),
}),
],
};
}
If I have a custom element and use the DOM remove()
function on it, will the unbind()
and detached()
lifecycle hooks on its view-model be called? For example
const myCustomElement = document.querySelector('#myCustomElement');
myCustomElement.remove()
I'm trying to track down whether I'm doing this incorrectly or if I should not expect those lifecycle hooks to be called when an element is removed from the DOM in this way.
I can confirm that those lifecycle hooks get called when the element is in a route and I navigate away from the route.
@processContent(...)
decorator within which I'm trying to register a custom component (like this example in the docs https://aurelia.io/docs/templating/custom-elements#decorators-for-customizing-aurelia-custom-element-processing sandbox link https://codesandbox.io/s/p7wo71qrzj?from-embed )
resources.registerElement(
"icon-list-item",
instruction.type["viewFactory"].resources.getElement("icon-list-item")
);
ERROR [templating] TypeError: Cannot read property 'resources' of undefined
viewFactory
can be undefined in a @processContent(...)
handler?
[HttpGet("{id:int}")]
. Having something like that would take care of it or being able to define a regex for a route param would also take care of it.
Hello. I used the information in the manual for setting up a simple aurelia with webpack, without using aurelia-cli. When I run npx webpack to build the project, I get this error:
ERROR in multi aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-loader-entry aurelia-boostrapper
Module not found: Error: Can't resolve 'aurelia-webpack-plugin/runtime/empty-entry' in '' @ multi-aurelia-webpack-plugin/runtime/empty-entry aurelia-webpack-plugin/runtime/pal-load-entry aurelia-bootstrapper main[0]
1
I've tried installing aurelia-pal-browser and aurelia-pal-nodejs with no change. Any ideas?
Is there a limit to the number of global resources I can register? I have a resources/index.ts that looks like
import {FrameworkConfiguration, PLATFORM} from 'aurelia-framework';
export function configure(config: FrameworkConfiguration) {
config.globalResources([
PLATFORM.moduleName('./elements/resource-1/resource-1'),
PLATFORM.moduleName('./elements/resource-2/resource-2'),
PLATFORM.moduleName('./elements/resource-2/resource-3/resource-3'),
PLATFORM.moduleName('./elements/resource-2/resource-3/inputs/resource-4/resource-4'),
PLATFORM.moduleName('./elements/resource-2/resource-3/inputs/resource-5/resource-5'),
PLATFORM.moduleName('./elements/resource-2/resource-3/inputs/resource-6/resource-6'),
PLATFORM.moduleName('./elements/resource-2/resource-3/inputs/resource-7/resource-7'),
PLATFORM.moduleName('./elements/resource-2/resource-3/inputs/resource-8/resource-8'),
PLATFORM.moduleName('./elements/resource-2/resource-3/inputs/resource-9/resource-9'),
PLATFORM.moduleName('./elements/resource-2/resource-3/inputs/resource-10/resource-10'),
]);
}
But when I inject ViewResources
into my app.ts constructor and print it out, I get
elements:
compose: HtmlBehaviorResource {elementName: "compose", attributeName: null, attributeDefaultBindingMode: undefined, liftsContent: false, targetShadowDOM: false, …}
resource-2: HtmlBehaviorResource {elementName: "resource-2", attributeName: null, attributeDefaultBindingMode: undefined, liftsContent: false, targetShadowDOM: false, …}
resource-1: HtmlBehaviorResource {elementName: "resource-1", attributeName: null, attributeDefaultBindingMode: undefined, liftsContent: false, targetShadowDOM: false, …}
resource-4: HtmlBehaviorResource {elementName: "resource-4", attributeName: null, attributeDefaultBindingMode: undefined, liftsContent: false, targetShadowDOM: false, …}
resource-3: HtmlBehaviorResource {elementName: "resource-3", attributeName: null, attributeDefaultBindingMode: undefined, liftsContent: false, targetShadowDOM: false, …}
router-view: HtmlBehaviorResource {elementName: "router-view", attributeName: null, attributeDefaultBindingMode: undefined, liftsContent: false, targetShadowDOM: false, …}
I confirmed that they all exist and can be found. Weirdly, if I comment out the resource-4
line in index.ts then ViewResources
will just show resources 1, 2, 3 & 5 instead. Is there a limit?
empty-entry
when doing npx webpack
. Either no one was willing to help, or they just didn't know the issue. I finally figured it out, so I'll post it here in the off chance anyone else runs into the problem: Make sure there are periods prefixed to the resolve extensions in your webpack config.