stencil-community / stencil-app-starter

Minimal starter project for building web components with Stencil
https://github.com/ionic-team/stencil
MIT License
320 stars 102 forks source link

Error when run npm run build #55

Closed gusterwoei closed 6 years ago

gusterwoei commented 6 years ago

Stencil version: (run npm list @stencil/core from a terminal/cmd prompt and paste output below):

@stencil/core@0.9.11

I'm submitting a ... (check one with "x") [x] bug report [ ] feature request [ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or https://stencil-worldwide.slack.com

Current behavior: Trying to run npm run build, got the following result:

Runtime error detected while rendering: stencil-route
           undefined is not a function
           /Users/Gusterwoei/Documents/Projects/pwa/github-repo-finder/node_modules/@stencil/core/dist/compiler/index.js:12745
           App.loadBundle = function loadBundle(bundleId, [, ...dependentsList], importer) { ^ TypeError: undefined is
           not a function at Object.loadBundle

Expected behavior: npm run build run successfully

Steps to reproduce: Run npm install --save-exact Run npm run build

Related code: package.json

{
  "name": "@stencil/starter",
  "private": true,
  "version": "0.0.1",
  "description": "Stencil App Starter",
  "files": [
    "dist/"
  ],
  "scripts": {
    "build": "stencil build --prerender",
    "dev": "sd concurrent \"stencil build --dev --watch\" \"stencil-dev-server\" ",
    "serve": "stencil-dev-server",
    "start": "npm run dev",
    "test": "jest",
    "test.watch": "jest --watch"
  },
  "dependencies": {
    "@stencil/core": "^0.9.11",
    "@stencil/router": "latest",
    "promise-polyfill": "^8.0.0",
    "whatwg-fetch": "^2.0.4"
  },
  "devDependencies": {
    "@stencil/dev-server": "latest",
    "@stencil/utils": "latest",
    "@types/jest": "^21.1.10",
    "jest": "^21.2.1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/ionic-team/stencil-app-starter.git"
  },
  "author": "Ionic Team",
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/ionic-team/stencil"
  },
  "homepage": "https://github.com/ionic-team/stencil",
  "jest": {
    "transform": {
      "^.+\\.(ts|tsx)$": "<rootDir>/node_modules/@stencil/core/testing/jest.preprocessor.js"
    },
    "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(tsx?|jsx?)$",
    "moduleFileExtensions": [
      "ts",
      "tsx",
      "js",
      "json",
      "jsx"
    ]
  }
}
gusterwoei commented 6 years ago

After some research, I found out that the issue is with 'whatwg-fetch' package. If any of the tsx file is importing whatwg-fetch and is defined as a stencil-route, running npm run build will cause the error.

jthoms1 commented 6 years ago

Are you importing whatwg-fetch? This is polyfilled out of the box with Stencil. Should just be able to execute fetch without worrying about it.

gusterwoei commented 6 years ago

You are right! I didn't know about that, thanks!