
Security News
vlt Launches "reproduce": A New Tool Challenging the Limits of Package Provenance
vlt's new "reproduce" tool verifies npm packages against their source code, outperforming traditional provenance adoption in the JavaScript ecosystem.
@flix-tech/stencil-i18n
Advanced tools
Generating staticly translated bundles.
npm i @flix-tech/stencil-i18n
configure it in stencil.config.js
const { i18n } = require('@flix-tech/stencil-i18n');
...
plugins: [
...,
i18n({
functionName: 'i18n', // default value is i18n
dictionaryPath: 'src/i18n',
srcPath: 'src' // default value is src
})
]
Create the dummy function inside src folder to satisfy typescript and have a fallback.
export function i18n(key: string, params?: { [index: string]: string | number }): string {
return key;
}
Put the translation files messages.${locale}.json
into the dictionaryPath
like specified in the stencil config.
Configure the build task in your package.json
similar to the following.
"build": "for lang in en de; do i18n_locale=$lang stencil build && mkdir -p dist-build/$lang && mv dist/* dist-build/$lang; done && mv dist-build/* dist/ && rm -R dist-build"
Be sure to put the i18n_locale
environment variable containing the same as messages.${locale}.json
locale
.
Use the function you defined in functionName
to translate.
Import the dummy function defined before.
const param3 = 'bye';
...
i18n('TRANSLATION.KEY', {
param1: 1234,
param2: 'hello',
param3
});
To include the resulting components into your angular project do a dynamic import in the app component to have the components in the whole project but be able to also access the LOCALE_ID
. YOUR_COMPONENT_NAME
can be the npm name @scope/package
.
import { Component, Inject, LOCALE_ID } from '@angular/core';
@Component({
selector: 'app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss'],
})
export class AppComponent {
constructor(@Inject(LOCALE_ID) locale: string) {
import(`<YOUR_COMPONENT_NAME>/dist/${locale}/loader`).then((webcomponent) => {
webcomponent.defineCustomElements(window);
});
}
}
FAQs
Static translations for stenciljs
The npm package @flix-tech/stencil-i18n receives a total of 2 weekly downloads. As such, @flix-tech/stencil-i18n popularity was classified as not popular.
We found that @flix-tech/stencil-i18n demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 4 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
vlt's new "reproduce" tool verifies npm packages against their source code, outperforming traditional provenance adoption in the JavaScript ecosystem.
Research
Security News
Socket researchers uncovered a malicious PyPI package exploiting Deezer’s API to enable coordinated music piracy through API abuse and C2 server control.
Research
The Socket Research Team discovered a malicious npm package, '@ton-wallet/create', stealing cryptocurrency wallet keys from developers and users in the TON ecosystem.