I dont get how namespaces work in SAP Commerce. (https://sap.github.io/spartacus-docs/1.x/i18n/)
How i think it works is as follows:
Add the HTML {{ 'updatePasswordForm.oldPassword.placeholder' | cxTranslate }}
add that in your translation.ts
updatePasswordForm:{
oldPassword:{
placeholder: "Old password"
}
},
Config of chunks and namespaces mapping
with the last part i have my problem. I don't know where to put it and my project just uses the default one. How do do i find that?
I recommend using translation chunks as described there:
https://sap.github.io/spartacus-docs/i18n/#configuring-chunks-and-namespace-mapping
Working solution.
In app.module.ts in providers provide this config:
provideConfig({
i18n: {
backend: {
loadPath: 'assets/i18n-assets/{{lng}}/{{ns}}.json',
},
chunks: {
'forms': ['updatePasswordForm'],
},
},
}),
Afterwards, we can create a json file in src/assets/i18n-assets/en/forms.json and inside this file add the following lines:
{
"updatePasswordForm": {
"oldPassword": {
"placeholder": "Old password"
}
}
}
Explanation
loadPath defines the place where the translation chunks will be located.
{{lng}} defines a folder for translations language, e.g., en, de etc.
{{ns}} is placeholder for chunks.
In chunks we defined 'forms' field which corresponds to our translations file - forms.json.
Also, we have to map translations to namespaces - we have defined that our forms.json file contains namespaces ['updatePasswordForm'], so when translations will be needed for namespaces that starts with updatePasswordForm, the forms.json file will be loaded.
Related
Using this guide https://the-guild.dev/graphql/codegen/docs/advanced/generated-files-colocation
It works as intended for "operation-types" file, but how about the "types.ts" file itself, is it possible to generate separate type file depending for each operation needs, or just create the object types inside the ".generated.tsx" file?
my config is as follow, similar to the docs, its just putting into a folder called __generated__. Thank you.
const config: CodegenConfig = {
schema: 'http://localhost:4000/graphql',
documents: ['src/**/*.{gql,graphql}'],
generates: {
'src/codegen/types.ts': {
plugins: ['typescript'],
},
'src/': {
preset: 'near-operation-file',
presetConfig: { extension: '.generated.tsx', baseTypesPath: 'codegen/types.ts', folder: '__generated__' },
plugins: ['typescript-operations'],
}
}
}
I'm trying to enable i18n json files with SSR on assets folder following this docs:
https://sap.github.io/spartacus-docs/i18n/
But when enabled, all files in PT folder results 404 error.
Here's my provideConfig on spartacus-configuration.module.ts file:
and my assets folder:
Thanks for your time, have a nice day!
Looks like it's trying to load a bunch of json files that aren't in your directories.
What I did on mine was I provided original Spartacus translations then I added mine below that:
provideConfig(<I18nConfig>{
i18n: {
resources: translations,
chunks: translationChunksConfig,
fallbackLang: 'en'
},
}),
provideConfig(<I18nConfig>{
i18n: {
backend: {
loadPath: 'assets/i18n-assets/{{lng}}/{{ns}}.json',
chunks: {
footer: ['footer']
}
}
},
})
otherwise, you can try to add those files its complaining about (orderApproval.json, savedCart.json, etc) to your 'pt' folder (not sure what language that is but perhaps Spartacus doesn't come with translations for it)
I am building a navigation system for a Next.js app that would have routes like
http://localhost:3000/docs/section1/pageName
http://localhost:3000/docs/section2/pageName
etc
Under the hood these routes will point to a page /docs/:slug which is achievable with rewrites:
async rewrites() {
return [
{
source: '/docs/section1/:slug',
destination: '/docs/:slug'
},
{
source: '/docs/section2/:slug',
destination: '/docs/:slug'
}
];
}
But I'd like to pass the sectionN as a context variable to the destination path. So that the slug page could know which section was referred to originally. The purpose is to minimize the amount of underlying pages but to keep the pages navigation meaningful to user or search bot.
I understand that rewrites support/api can be limited. Checking the context in getInitialProps - original artificats are not available. Is there a way maybe to approach this differently in Next.js?
#felixmosh suggested in a comment to simply go with next.js dynamic routing that allows to use multiple slugs in the paths, no need to use rewrites.
That works!
Here goes the link to the official manual - https://nextjs.org/docs/routing/dynamic-routes.
Found solition:
async rewrites() {
return [
{
source: '/work/:slug/:path*',
destination: '/work/:slug',
},
]
},
It looks as though if you put your jsx files in the 'pages' folder of most gatsby starters, the urls follow the directory structure out of the box, so you can implement whatever urls you need (http://blah.com/foo/post1, http://blah.com/bar/post2) just by nesting folders in the source tree (pages/foo/post.jsx, pages/bar/post2.jsx).
The issue
I used the gatsby advanced starter (https://github.com/Vagr9K/gatsby-advanced-starter). It puts all content files not in pages/, but in a top-level content/ folder and I can't figure out the wiring to replicate foo/xxx, bar/xxx urls even after creating content/foo/post1.md, content/bar/post2.md folders.
It does have a siteconfig.js that sets a single path prefix, but I want two different prefixes for the 2 different sections of the site, so I just set it to "/" for now (builds seem to ignore whatever value I set for this config param anyway, so... shrug).
What I tried
I tried adding path to the frontmatter of the .md files and set it to the parent foldername. This was completely ignored (in any case I don't think that's what I want... I'd like to keep the generated slug as part of the url).
Separated use of gatsby-source-filesystem one for each subfolder hoping it would change graphql graph to recognize 2 separate data sources but it made no difference.
What am I doing wrong?
It looks as though if you put your jsx files in the 'pages' folder of most gatsby starters, the urls follow the directory structure out of the box [...]
That's not specific to Gatsby starters, that's Gatsby's default behaviour. Every js/jsx file in src/pages will be a page.
but in a top-level content/ folder
It still has the src/pages folder for normal pages. But the content folder holds the files will be transformed with the src/templates in gatsby-node.js to pages. Or in other words: The contents of the content folder get programmatically created with the defined template in gatsby-node.js (and the template lies in src/templates).
The path/url get's defined in the createPage function here: gatsby-nodeL144. This line is referencing the edge.node.fields.slug which gets queried in the GraphQL above here. The field gets added in the onCreateNode function. More specificially the slug field in the onCreateNodeField function. There you see that it gets passed a slug that gets defined above.
Create two folders in your src/content folder, e.g. blog and projects. Make sure that you have both of them defined in your gatsby-config.js:
{
resolve: 'gatsby-source-filesystem',
options: {
name: 'blog',
path: `${__dirname}/content/blog`,
},
},
{
resolve: 'gatsby-source-filesystem',
options: {
name: 'projects',
path: `${__dirname}/content/projects`,
},
},
In your gatsby-node.js add after the fileNode definition the line:
const pathPrefix = fileNode.sourceInstanceName
The sourceInstanceName is that what we defined as the name in gatsby-config entries.
Then you can alter the line to:
createNodeField({ node, name: "slug", value: `/${pathPrefix}${slug}` });
createNodeField({ node, name: 'sourceInstanceName', value: pathPrefix });
The second line is helpful if you then want to query only for one of the two folders, e.g.:
export const pageQuery = graphql`
query BlogQuery {
allMarkdownRemark(filter: { fields: { sourceInstanceName: { eq: "blog } } }
) {
edges {
node {
... etc
}
}
}
}
`
I'm trying to get this Grunt plugin to work:
https://npmjs.org/package/dss
This documentation plugin ironically seems to be lacking proper documentation. Can someone help me out by giving me an example of something that worked for them. The main thing that's screwing me up is the "your_target" property. Not sure what's suppose to go in there.
Say I have a SASS file in the following path from the root directory:
sass/main.scss
What would my ouput be by default? And where would it output to? Also what format does it ouput to?
grunt.initConfig({
DSS: {
options: {
// Task-specific options go here.
},
your_target: {
// Target-specific file lists and/or options go here.
},
},
})
Is "your_target" property the path to my sass file or the path to the documentation file I'm trying to create? Would it be defined like this?
...
your_target: {
// Target-specific file lists and/or options go here.
sass: "sass/main.scss"
},
...
I don't know what the property name should be. :(
dss: {
docs: {
options: {
},
files: {
'api/': 'css/**/*.{css,scss,sass,less,styl}'
}
}
}