Skip to content

Is this config broken? #3

@benjamin-thomas

Description

@benjamin-thomas

Hi, I'd like to play with this config but I'm too much of a noob regarding webpack to understand what's broken here.

me@host:~/code/shoelace-webpack-example$ npm --version
6.14.10

npm install followed by npm run start returns the following warnings

WARNING in ./src/index.js 5:0-20
"export 'defineCustomElements' was not found in '@shoelace-style/shoelace'

WARNING in ./src/index.js 4:0-12
"export 'setAssetPath' was not found in '@shoelace-style/shoelace'

On page load, the bundled js fails:

index.js?b635:4 Uncaught TypeError: Object(...) is not a function
    at eval (index.js?b635:4)
    at Module../src/index.js (main.js:167)
    at __webpack_require__ (main.js:20)
    at main.js:84
    at main.js:87

Which points to a problem with this function:

setAssetPath(document.currentScript.src);

I then tried to play with various import schemes, to no avail.

me@host:~/code/shoelace-webpack-example$ ag -F 'defineCustomElements' -l ./node_modules/@shoelace-style/ | grep -v 'shoelace/node_modules'
node_modules/@shoelace-style/shoelace/loader/node-main.js
node_modules/@shoelace-style/shoelace/loader/index.d.ts
node_modules/@shoelace-style/shoelace/dist/custom-elements/index.mjs
node_modules/@shoelace-style/shoelace/dist/custom-elements/index.d.ts
node_modules/@shoelace-style/shoelace/dist/cjs/loader.cjs.js
node_modules/@shoelace-style/shoelace/dist/esm/loader.mjs

So tried this import (setAssetsPath does not resolve):

import { defineCustomElements } from '@shoelace-style/shoelace/dist/custom-elements';
me@host:~/code/shoelace-webpack-example$ ag -F 'setAssetPath' -l ./node_modules
node_modules/@stencil/core/internal/hydrate/index.js
node_modules/@stencil/core/internal/stencil-core.d.ts
node_modules/@stencil/core/internal/client/index.js
node_modules/@stencil/core/internal/stencil-public-runtime.d.ts
node_modules/@stencil/core/internal/testing/index.js
node_modules/@stencil/core/CHANGELOG.md
node_modules/@stencil/core/compiler/stencil.min.js
node_modules/@stencil/core/compiler/stencil.js

Then this (I don't think I'm supposed to do this anyways):

import {setAssetPath} from "@stencil/core";

Could you please advice? Could I be missing a dependency of some sort? Or a requirement?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions