Error - [webpack] 'dist':
./node_modules/lit-html/directives/class-map.js 6:106
Module parse failed: Unexpected token (6:106)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| Copyright 2018 Google LLC
| SPDX-License-Identifier: BSD-3-Clause
t.strings?.length>2)throw Error("classMap() can only be used in the class attribute and must be the only part in the attribute.")}render(t){return" "+Object.keys(t).filter((s=>t[s])).join(" ")+" "}update(s,[i]){if(void 0===this.st){this.st=new Set,void 0!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(//s/).filter((t=>""!==t))));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i
(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)
this.nt?.has(t)
(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)))}return t}});export{e as classMap};
//# sourceMappingURL=class-map.js.map
@ ./node_modules/lit/directives/class-map.js 1:0-46 1:0-46
@ ./node_modules/@microsoft/mgt-components/dist/es6/components/mgt-agenda/mgt-agenda.js
@ ./node_modules/@microsoft/mgt-components/dist/es6/components/components.js
@ ./node_modules/@microsoft/mgt-components/dist/es6/exports.js
@ ./node_modules/@microsoft/mgt-react/dist/es6/index.js
@ ./lib/webparts/helloWorld/components/HelloWorld.js
@ ./lib/webparts/helloWorld/HelloWorldWebPart.js
./node_modules/lit-html/directives/if-defined.js 6:16
Module parse failed: Unexpected token (6:16)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
* Copyright 2018 Google LLC
SPDX-License-Identifier: BSD-3-Clause
/const o=o=>o??t;export{o as ifDefined};
//# sourceMappingURL=if-defined.js.map
@ ./node_modules/lit/directives/if-defined.js 1:0-47 1:0-47
@ ./node_modules/@microsoft/mgt-components/dist/es6/components/mgt-picker/mgt-picker.js
@ ./node_modules/@microsoft/mgt-components/dist/es6/components/components.js
@ ./node_modules/@microsoft/mgt-components/dist/es6/exports.js
@ ./node_modules/@microsoft/mgt-react/dist/es6/index.js
@ ./lib/webparts/helloWorld/components/HelloWorld.js
@ ./lib/webparts/helloWorld/HelloWorldWebPart.js
./node_modules/lit-element/lit-element.js 6:194
Module parse failed: Unexpected token (6:194)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
* Copyright 2017 Google LLC
SPDX-License-Identifier: BSD-3-Clause
/class s extends t{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const i=this.render();this.hasUpdated
(this.renderOptions.isConnected=this.isConnected),super.update(t),this.$Do=e(i,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this.$Do?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this.$Do?.setConnected(!1)}render(){return i}}s.$litElement$=!0,s[("finalized","finalized")]=!0,globalThis.litElementHydrateSupport?.({LitElement:s});const r=globalThis.litElementPolyfillSupport;r?.({LitElement:s});const o={$AK:(t,e,i)=>{t.$AK(e,i)},$AL:t=>t.$AL};(globalThis.litElementVersions??=[]).push("4.0.4");export{s as LitElement,o as _$LE};
//# sourceMappingURL=lit-element.js.map
@ ./node_modules/lit/index.js 1:47-87 1:47-87
@ ./node_modules/@microsoft/mgt-element/dist/es6/components/baseTaskComponent.js
@ ./node_modules/@microsoft/mgt-element/dist/es6/index.js
@ ./lib/webparts/helloWorld/HelloWorldWebPart.js
./node_modules/lit-html/lit-html.js 6:302
Module parse failed: Unexpected token (6:302)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
r!==this.$AH[n],r===T?t=T:t!==T&&(t+=(r??"")+h[n+1]),this.$AH[n]=r}o&&!e&&this.j(t)}j(t){t===T?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}}class k extends R{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===T?void 0:t}}class H extends R{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==T)}}class I extends R{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5}$AI(t,i=this){if((t=N(this,t,i,0)??T)===w)return;const s=this.$AH,e=t===T&&s!==T
t.capture!==s.capture
t.once!==s.once
t.passive!==s.passive,h=t!==T&&(s===T
e);e&&this.element.removeEventListener(this.name,this,s),h&&this.element.addEventListener(this.name,this,t),this.$AH=t}handleEvent(t){"function"==typeof this.$AH?this.$AH.call(this.options?.host??this.element,t):this.$AH.handleEvent(t)}}class L{constructor(t,i,s){this.element=t,this.type=6,this.$AN=void 0,this.$AM=i,this.options=s}get $AU(){return this.$AM.$AU}$AI(t){N(this,t)}}const z={P:e,A:h,C:o,M:1,L:P,R:S,D:u,V:N,I:M,H:R,N:H,U:I,B:k,F:L},Z=t.litHtmlPolyfillSupport;Z?.(V,M),(t.litHtmlVersions??=[]).push("3.1.2");const j=(t,i,s)=>{const e=s?.renderBefore??i;let h=e.$litPart$;if(void 0===h){const t=s?.renderBefore??null;e.$litPart$=h=new M(i.insertBefore(l(),t),t,void 0,s??{})}return h.$AI(t),h};export{z as $LH,x as html,w as noChange,T as nothing,j as render,b as svg};
//# sourceMappingURL=lit-html.js.map
@ ./node_modules/lit/index.js 1:30-47
@ ./node_modules/@microsoft/mgt-element/dist/es6/components/baseTaskComponent.js
@ ./node_modules/@microsoft/mgt-element/dist/es6/index.js
@ ./lib/webparts/helloWorld/HelloWorldWebPart.js
./node_modules/@lit/task/task.js 6:421
Module parse failed: Unexpected token (6:421)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
s.length===i.length&&s.every(((s,h)=>!t(s,i[h])));export{h as Task,s as TaskStatus,i as initialState,r as shallowArrayEquals};
//# sourceMappingURL=task.js.map
@ ./node_modules/@lit/task/index.js 1:0-71 1:0-71 1:0-71 1:0-71 1:0-71
@ ./node_modules/@microsoft/mgt-element/dist/es6/components/baseTaskComponent.js
@ ./node_modules/@microsoft/mgt-element/dist/es6/index.js
@ ./lib/webparts/helloWorld/HelloWorldWebPart.js
./node_modules/@lit/reactive-element/decorators/query-assigned-nodes.js 6:47
Module parse failed: Unexpected token (6:47)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
* Copyright 2017 Google LLC
SPDX-License-Identifier: BSD-3-Clause
/function n(n){return(o,r)=>{const{slot:e}=n??{},s="slot"+(e?[name=${e}]:":not([name])");return t(o,r,{get(){const t=this.renderRoot?.querySelector(s);return t?.assignedNodes(n)??[]}})}}export{n as queryAssignedNodes};
//# sourceMappingURL=query-assigned-nodes.js.map
@ ./node_modules/lit/decorators.js 1:488-558 1:488-558
@ ./node_modules/@microsoft/mgt-element/dist/es6/components/baseProvider.js
@ ./node_modules/@microsoft/mgt-element/dist/es6/index.js
@ ./lib/webparts/helloWorld/HelloWorldWebPart.js
./node_modules/@lit/reactive-element/decorators/query-assigned-elements.js 6:58
Module parse failed: Unexpected token (6:58)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
* Copyright 2021 Google LLC
SPDX-License-Identifier: BSD-3-Clause
/function o(o){return(e,n)=>{const{slot:r,selector:s}=o??{},c="slot"+(r?[name=${r}]:":not([name])");return t(e,n,{get(){const t=this.renderRoot?.querySelector(c),e=t?.assignedElements(o)??[];return void 0===s?e:e.filter((t=>t.matches(s)))}})}}export{o as queryAssignedElements};
@ ./node_modules/lit/decorators.js 1:415-488 1:415-488
@ ./node_modules/@microsoft/mgt-element/dist/es6/components/baseProvider.js
@ ./node_modules/@microsoft/mgt-element/dist/es6/index.js
@ ./lib/webparts/helloWorld/HelloWorldWebPart.js
./node_modules/@lit/reactive-element/decorators/query.js 6:59
Module parse failed: Unexpected token (6:59)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
this.hasUpdated)&&r.call(this,t)),t}})}return t(n,s,{get(){return o(this)}})}}export{e as query};
//# sourceMappingURL=query.js.map
@ ./node_modules/lit/decorators.js 1:240-295 1:240-295
@ ./node_modules/@microsoft/mgt-element/dist/es6/components/baseProvider.js
@ ./node_modules/@microsoft/mgt-element/dist/es6/index.js
@ ./lib/webparts/helloWorld/HelloWorldWebPart.js
./node_modules/@lit/reactive-element/reactive-element.js 6:629
Module parse failed: Unexpected token (6:629)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}$EU(){this.$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this.$ES}shouldUpdate(t){return!0}update(t){this.$Ej&&=this.$Ej.forEach((t=>this.$EC(t,this[t]))),this._$EU()}updated(t){}firstUpdated(t){}}b.elementStyles=[],b.shadowRootOptions={mode:"open"},b[d("elementProperties")]=new Map,b[d("finalized")]=new Map,p?.({ReactiveElement:b}),(a.reactiveElementVersions??=[]).push("2.0.4");export{b as ReactiveElement,u as defaultConverter,f as notEqual};
//# sourceMappingURL=reactive-element.js.map
@ ./node_modules/@lit/reactive-element/decorators/property.js 1:0-72 6:47-48 6:71-72
@ ./node_modules/lit/decorators.js
@ ./node_modules/@microsoft/mgt-element/dist/es6/components/baseProvider.js
@ ./node_modules/@microsoft/mgt-element/dist/es6/index.js
@ ./lib/webparts/helloWorld/HelloWorldWebPart.js
./node_modules/lit-html/directives/repeat.js 7:513
Module parse failed: Unexpected token (7:513)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
* SPDX-License-Identifier: BSD-3-Clause
*/
const u=(e,s,t)=>{const r=new Map;for(let l=s;l<=t;l++)r.set(e[l],l);return r},c=s(class extends t{constructor(e){if(super(e),e.type!==r.CHILD)throw Error("repeat() can only be used in text expressions")}dt(e,s,t){let r;void 0===t?t=s:void 0!==s&&(r=s);const l=[],o=[];let i=0;for(const s of e)l[i]=r?r(s,i):i,o[i]=t(s,i),i++;return{values:o,keys:l}}render(e,s,t){return this.dt(e,s,t).values}update(s,[t,r,c]){const d=l(s),{values:p,keys:a}=this.dt(t,r,c);if(!Array.isArray(d))return this.ut=a,p;const h=this.ut??=[],v=[];let m,y,x=0,j=d.length-1,k=0,w=p.length-1;for(;x<=j&&k<=w;)if(null===d[x])x++;else if(null===d[j])j--;else if(h[x]===a[k])v[k]=o(d[x],p[k]),x++,k++;else if(h[j]===a[w])v[w]=o(d[j],p[w]),j--,w--;else if(h[x]===a[w])v[w]=o(d[x],p[w]),i(s,v[w+1],d[x]),x++,w--;else if(h[j]===a[k])v[k]=o(d[j],p[k]),i(s,d[x],d[j]),j--,k++;else if(void 0===m&&(m=u(a,k,w),y=u(h,x,j)),m.has(h[x]))if(m.has(h[j])){const e=y.get(a[k]),t=void 0!==e?d[e]:null;if(null===t){const e=i(s,d[x]);o(e,p[k]),v[k]=e}else v[k]=o(t,p[k]),i(s,d[x],t),d[e]=null;k++}else n(d[j]),j--;else n(d[x]),x++;for(;k<=w;){const e=i(s,v[w+1]);o(e,p[k]),v[k++]=e}for(;x<=j;){const e=d[x++];null!==e&&n(e)}return this.ut=a,f(s,v),e}});export{c as repeat};
//# sourceMappingURL=repeat.js.map
@ ./node_modules/lit/directives/repeat.js 1:0-43 1:0-43
@ ./node_modules/@microsoft/mgt-components/dist/es6/components/mgt-file-list/mgt-file-list.js
@ ./node_modules/@microsoft/mgt-components/dist/es6/components/components.js
@ ./node_modules/@microsoft/mgt-components/dist/es6/exports.js
@ ./node_modules/@microsoft/mgt-react/dist/es6/index.js
@ ./lib/webparts/helloWorld/components/HelloWorld.js
@ ./lib/webparts/helloWorld/HelloWorldWebPart.js
./node_modules/@lit/reactive-element/decorators/query-all.js 7:69
Module parse failed: Unexpected token (7:69)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
* SPDX-License-Identifier: BSD-3-Clause
*/
let e;function r(r){return(n,o)=>t(n,o,{get(){return(this.renderRoot??(e??=document.createDocumentFragment())).querySelectorAll(r)}})}export{r as queryAll};
//# sourceMappingURL=query-all.js.map
@ ./node_modules/lit/decorators.js 1:295-354 1:295-354
@ ./node_modules/@microsoft/mgt-element/dist/es6/components/baseProvider.js
@ ./node_modules/@microsoft/mgt-element/dist/es6/index.js
@ ./lib/webparts/helloWorld/HelloWorldWebPart.js
./node_modules/@lit/reactive-element/decorators/query-async.js 7:95
Module parse failed: Unexpected token (7:95)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
* SPDX-License-Identifier: BSD-3-Clause
*/
function r(r){return(n,e)=>t(n,e,{async get(){return await this.updateComplete,this.renderRoot?.querySelector(r)??null}})}export{r as queryAsync};
Bug Report
Prerequisites
For more information, see the
CONTRIBUTING
guide.Description
I am trying to use graph toolkit with SPFx and followed the steps provided in https://learn.microsoft.com/en-us/graph/toolkit/get-started/mgt-spfx but gulp serve is throwing error
Error - [webpack] 'dist': ./node_modules/lit-html/directives/class-map.js 6:106 Module parse failed: Unexpected token (6:106) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders | Copyright 2018 Google LLC | SPDX-License-Identifier: BSD-3-Clause
Expected behavior: - version 4.0.1 should work with SPFx
Actual behavior:- version 4.0.1 is not working whereas version 3.1.3 is working fine.