Problem referencing function defined in Layout ( inside <Script> tag ) from component
Unanswered
Siberian Flycatcher posted this in #help-forum
Siberian FlycatcherOP
Layout Function Definition:
<Script>
{
</Script>
Component:
'use client';
export function PinterestTagOrderReport({
order_id,
order_value
}: {
order_id: string | undefined;
order_value: number | undefined;
}) {
pintrk('track', 'checkout', {
event_id: order_id,
value: order_value,
currency: 'USD'
});
return #Unknown Channel</>;
}
This is a component that reports an order to Pinterest. At build time I am getting the following error: Type error: Cannot find name 'pintrk'. I define the 'pintrk' function through a <Script> tag on the layout page ( shown above ). Do you know how I tell NextJS that the function is defined in the layout?
<Script>
{
!function(e){if(!window.pintrk){window.pintrk = function () {
window.pintrk.queue.push(Array.prototype.slice.call(arguments))};var
n=window.pintrk;n.queue=[],n.version="3.0";var
t=document.createElement("script");t.async=!0,t.src=e;var
r=document.getElementsByTagName("script")[0];
r.parentNode.insertBefore(t,r)}}("https://s.pinimg.com/ct/core.js");
pintrk('load', 'xxxxxxxxxxxx');
pintrk('page');}</Script>
Component:
'use client';
export function PinterestTagOrderReport({
order_id,
order_value
}: {
order_id: string | undefined;
order_value: number | undefined;
}) {
pintrk('track', 'checkout', {
event_id: order_id,
value: order_value,
currency: 'USD'
});
return #Unknown Channel</>;
}
This is a component that reports an order to Pinterest. At build time I am getting the following error: Type error: Cannot find name 'pintrk'. I define the 'pintrk' function through a <Script> tag on the layout page ( shown above ). Do you know how I tell NextJS that the function is defined in the layout?