shopware/frontends - nuxt3-module
Nuxt module that allows you to set up a Nuxt 3 project with Shopware Frontends. It provides the composables and api-client packages.
If you want to use these packages with a different Vue.js framework, see the guide for using Shopware Frontends in a custom project or use the vue3-plugin.
Features
Setup
Install npm package:
pnpm add -D @shopware-pwa/nuxt3-module
yarn add --dev @shopware-pwa/nuxt3-module
npm i @shopware-pwa/nuxt3-module --save-dev
Then, register the module by editing nuxt.config.js
or (.ts
) file (by extending modules
array):
export default defineNuxtConfig({
modules: [, "@shopware-pwa/nuxt3-module"],
runtimeConfig: {
public: {
shopware: {
shopwareEndpoint: "https://demo-frontends.shopware.store",
shopwareAccessToken: "SWSCBHFSNTVMAWNZDNFKSHLAYW",
},
},
},
});
Set up your own API instance by adding public runtimeConfiguration
in the same file. The nuxt module (and vue plugin) will use this values.
Basic usage
Now you can use any composable function you need without extra import:
<script setup>
const { login } = useUser();
const { refreshSessionContext } = useSessionContext();
refreshSessionContext();
</script>
The information about the session is kept in a cookie (sw-context-token
) and used in every request made by any composable or directly, invoked by api instance
:
<script>
const { apiInstance } = useShopwareContext();
const rawApiResponse = await apiInstance.invokePost();
</script>
TypeScript support
All composable functions are fully typed with TypeScript and they are registed globally in Nuxt.js application, so the type hinting will help you to work with all of them.
📦 Advanced packaging
Internally, the module uses API Client and Composables packages, configured together to make everything working well. If you need to check how it's working on a different version of one of them, install a package locally in your project (to be installed and available in project's package.json
file), then the Nuxt module will use yours. Keep in mind that the different configuration may lead to unexpected behavior.
Links
Changelog
Full changelog for stable version is available here
Latest changes: 0.0.0-canary-20230516123926
Patch Changes
-
#172 4b323a1
Thanks @patzick! - Proper SSR context for requests. Logged in client have hydrated data on reload.
-
#204 ed35e37
Thanks @mkucmus! - Package.json parser removed
-
#200 329b0ae
Thanks @mkucmus! - Internal dependency resolving
-
Updated dependencies [0e85ad1
, 3764736
, 7fe3087
, e03c67a
, 1fd1962
, bb64070
, 693f982
, eddcfcc
, 8dc64e3
, eddcfcc
, 7fe3087
, 0188b36
]:
- @shopware-pwa/composables-next@0.0.0-canary-20230516123926
- @shopware-pwa/api-client@0.0.0-canary-20230516123926