[WIP] Update NuxtJS sample project configuration for WebViewer

[Copilot]

Thanks for asking me to work on this. I will get started on it and keep this PR's description up to date as I form a plan and make progress.

Original prompt

Issue: AS-386
Summary: [WebViewer Samples] NuxtJS GitHub Sample Update Configuration
Description: Smoke testing of the WebViewer NuxtJS sample project showed that this project has config issues on WebViewer v12.

Sample:

webviewer-samples/webviewer-nuxtjs at main · ApryseSDK/webviewer-samples (https://github.com/ApryseSDK/webviewer-samples/tree/main/webviewer-nuxtjs)

Fix details
Load WebViewer directly in the nuxt config by adding
script: [
{ src: '/lib/webviewer/webviewer.min.js', defer: true }
]
to the head property in nuxt.config.js

Update WebViewer.vue and replace the mounted code with
const WebViewer = globalThis.WebViewer;
if (!WebViewer) {
console.error('WebViewer script not loaded');
return;
}

WebViewer.Iframe({
path: '/lib/webviewer',
initialDoc: this.url,
licenseKey: 'your_license_key'
}, this.$refs.viewer).then((instance) => {
// call apis here
});
Once this is updated, the demo runs:

Custom Fields:
Development: {}
Epic Link: AS-365
Rank: 0|i00007:2ixi0s6mb0g
Sprint: AS Sprint June 29 - July 13 (future)
Acceptance Criteria: - WebViewer v12.0 installation should work with the config updates

• Smoke test this demo
  Checklist Progress %: 0.0
  [CHART] Date of First Response: 2026-06-18T10:04:59.828-0700

Comments:

• Logan Bittner at 2026-06-18T17:04:59Z: Can you please make this change in the ApryseSDK/webviewer-samples respository. The changes should be made in the webviewer-nuxtjs folder.

Please make a draft PR, setting the base to v12-holding branch.

• GitHub Copilot for Jira at 2026-06-18T17:06:13Z: Copilot has opened a pull request for this issue: Update WebViewer NuxtJS sample for v12 #107

Parent Issue: AS-365
Parent Summary: V12 Showcase and Samples updates
Parent Description: This epic comprises of all the work associated with supporting the v12 SDK upgrade.

You have been assigned to a work item "[WebViewer Samples] NuxtJS GitHub Sample Update Configuration". Analyze the details of the work item and get started.
Summary: [WebViewer Samples] NuxtJS GitHub Sample Update Configuration
Description: Smoke testing of the WebViewer NuxtJS sample project showed that this project has config issues on WebViewer v12.

Sample:
webviewer-samples/webviewer-nuxtjs at main · ApryseSDK/webviewer-samples
Fix details
Load WebViewer directly in the nuxt config by adding
script: [
{ src: '/lib/webviewer/webviewer.min.js', defer: true }
]
to the head property in nuxt.config.js
Update WebViewer.vue and replace the mounted code with
const WebViewer = globalThis.WebViewer;
if (!WebViewer) {
console.error('WebViewer script not loaded');
return;
}
WebViewer.Iframe({
path: '/lib/webviewer',
initialDoc: this.url,
licenseKey: 'your_license_key'
}, this.$refs.viewer).then((instance) => {
// call apis here
});
Once this is updated, the demo runs:
[media]

Branch naming

This task relates to issue AS-386 — preserve that identifier somewhere in the branch name and pull request title for traceability. Do not treat the identifier as a verbatim slug or prepend it with a hyphen by default; instead, adapt the full branch name to comply with the repository's branch-naming pattern, adding any required prefix or restructuring the shape as needed.

Include a link to the original issue in the pull request description: https://apryse.atlassian.net/browse/AS-386