Stencil: --prerender for app starter freezes

Created on 15 Oct 2018  路  11Comments  路  Source: ionic-team/stencil

Stencil version:

 @stencil/[email protected]

I'm submitting a:

[x] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://stencil-worldwide.herokuapp.com/ or https://forum.ionicframework.com/

Current behavior:

Prerendering with --prerender in the (default) www mode just freezes after [56:11.8] prerender, started: / .... No error when using --debug.

Expected behavior:

build succeeds

Steps to reproduce:

  1. npm init stencil
  2. select app
  3. npm run build

Related code:

// insert any relevant code here

Other information:

triage

All 11 comments

@destructive-dragon Had the same issue. Upgrading to the latest stable (0.14.x) seems to have fixed the problem.

v0.16 fails.

[17:07.4]  prerendering started ...
[17:07.4]  prerender, started: / ...
[17:08.2]  prerender, finished: / in 807 ms
[17:08.2]  prerendering failed in 810 ms

[ WARN  ]  Bundling Warning
           Generated an empty bundle

[ ERROR ]  TypeError [ERR_INVALID_ARG_TYPE]: The "url" argument must be of type string. Received type
           undefined at Url.parse (url.js:152:11) at Object.urlParse [as parse] (url.js:146:13) at
           getWritePathFromUrl
           (/Users/crhain88/Development/stencil-app-starter/node_modules/@stencil/core/dist/compiler/index.js:8936:38)
           at
           /Users/crhain88/Development/stencil-app-starter/node_modules/@stencil/core/dist/compiler/index.js:15262:26
           at Generator.next (<anonymous>) at
           /Users/crhain88/Development/stencil-app-starter/node_modules/@stencil/core/dist/compiler/index.js:32:71
           at new Promise (<anonymous>) at __awaiter
           (/Users/crhain88/Development/stencil-app-starter/node_modules/@stencil/core/dist/compiler/index.js:28:12)
           at writePrerenderDest
           (/Users/crhain88/Development/stencil-app-starter/node_modules/@stencil/core/dist/compiler/index.js:15260:12)
           at
           /Users/crhain88/Development/stencil-app-starter/node_modules/@stencil/core/dist/compiler/index.js:15246:19

[ ERROR ]  evalmachine.<anonymous>:4 })(x,r); ^ ReferenceError: x is not defined at
           evalmachine.<anonymous>:4:4 at evalmachine.<anonymous>:5:3 at Script.runInContext
           (vm.js:130:20) at Object.runInContext (vm.js:298:6) at Object.runInContext
           (/Users/crhain88/Development/stencil-app-starter/node_modules/@stencil/core/dist/sys/node/index.js:1:13735)
           at runGlobalScripts
           (/Users/crhain88/Development/stencil-app-starter/node_modules/@stencil/core/dist/compiler/index.js:13557:23)
           at createPlatformServer
           (/Users/crhain88/Development/stencil-app-starter/node_modules/@stencil/core/dist/compiler/index.js:13360:5)
           at resolve
           (/Users/crhain88/Development/stencil-app-starter/node_modules/@stencil/core/dist/compiler/index.js:13639:21)
           at new Promise (<anonymous>) at hydrateHtml
           (/Users/crhain88/Development/stencil-app-starter/node_modules/@stencil/core/dist/compiler/index.js:13622:12)

[17:08.2]  build failed in 12.95 s

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

crhain88 at atl-it-1804 in ~/Development/stencil-app-starter on master [!]

stencil-component-starter also fails:

[17:38.7]  prerendering started ...
[17:38.8]  prerender, started: / ...
[17:38.8]  missing app global:
           /Users/crhain88/Development/stencil-component-starter/www/build/mycomponent/mycomponent.global.js

Just discovered a fix mentioned in: https://github.com/ionic-team/stencil/issues/553

the --prerender flag breaks if the component uses Shadow DOM

I'm running into this issue when using stencil v0.17.0 - not using shadow dom, just rendering html - 0.16.0 and below would "fail gracefully" meaning they never finished rendering a certain page of mine, not giving me an error message (wish I knew what was wrong with a particular page) - however in 0.17.0 - it freezes during prerender.

I was able to fix this by removing a number from the name of the file. we had a file named guide-oauth2.tsx, when renaming it to guide-oauth.tsx, the problem went away. Regardless of environment (ci env, linux, macos local) - and also upon removal of .stencil cache, it appears that prerender does not like numbers. in 0.16, it just never creates the html file, and prematurely terminates the process with exit 0 acting like everything is good. In 0.17, it freezes.

@CRHain88 and @destructive-dragon

I tried to debug the issue in Stencil 0.17.1-0 with npm init stencil using the component starter I get the same error about url must be string.

Digging a little deeper i found the following line in the callstack:

const filePath = getWritePathFromUrl(config, outputTarget, results.url);

Outputting results gives me:

{ diagnostics:
   [ { level: 'error',
       type: 'build',
       header: 'Build Error',
       messageText:
        'ReferenceError: window is not defined\n    at initHostSnapshot (C:\\projects\\foo\\newstencil\\node_modules\\@stencil\\core\\dist\\compiler\\index.js:11152:13)\n    at connectHostElement (C:\\projects\\foo\\newstencil\\node_modules\\@stencil\\core\\dist\\compiler\\index.js:12891:26)\n    at connectElement (C:\\projects\\foo\\newstencil\\node_modules\\@stencil\\core\\dist\\compiler\\index.js:12876:13)\n    at connectChildElements (C:\\projects\\foo\\newstencil\\node_modules\\@stencil\\core\\dist\\compiler\\index.js:12866:13)\n    at resolve (C:\\projects\\foo\\newstencil\\node_modules\\@stencil\\core\\dist\\compiler\\index.js:13798:9)\n    at new Promise (<anonymous>)\n    at hydrateHtml (C:\\projects\\foo\\newstencil\\node_modules\\@stencil\\core\\dist\\compiler\\index.js:13697:12)\n    at Renderer.<anonymous> (C:\\projects\\foo\\newstencil\\node_modules\\@stencil\\core\\dist\\compiler\\index.js:15123:40)\n    at Generator.next (<anonymous>)\n    at C:\\projects\\foo\\newstencil\\node_modules\\@stencil\\core\\dist\\compiler\\index.js:32:71',
       relFilePath: null,
       absFilePath: null,
       lines: [] } ],
  url: undefined,
  html:
   `<!DOCTYPE html>\n<html dir="ltr" lang="en">\n<head>\n  <meta charset="utf-8">\n  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0">\n  <title>Stencil Component Starter</title>\n  <script src="/build/mycomponent.js"></script>\n\n</head>\n<body>\n\n  <my-component first="Stencil" last="'Don't call me a framework' JS"></my-component>\n\n</body>\n</html>\n`,
  styles: null,
  anchors: [],
  components: [],
  styleUrls: [],
  scriptUrls: [],
  imgUrls: [] 
}

With v0.17.0 I had the same error respectively:

[ ERROR ]  TypeError [ERR_INVALID_ARG_TYPE]: The "url" argument must be of type string. Received type undefined at
           Url.parse (url.js:154:11) at Object.urlParse [as parse] (url.js:148:13) at getWritePathFromUrl
           (/Users/.../node_modules/@stencil/core/dist/compiler/index.js:8992:38)

...

[ ERROR ]  evalmachine.<anonymous>:4 })(x,r); ^ ReferenceError: x is not defined at evalmachine.<anonymous>:4:4 at
           evalmachine.<anonymous>:9:3 at Script.runInContext (vm.js:133:20) at Object.runInContext (vm.js:301:6) at
           Object.runInContext
           (/Users/.../node_modules/@stencil/core/dist/sys/node/index.js:1:13895)

once I updated to v0.17.1 I've got now the following error:

[ ERROR ]  ENOENT: no such file or directory, open
           '/Users/.../www/build/app/undefined.es5.entry.js' at
           Object.openSync (fs.js:450:3) at Object.readFileSync (fs.js:350:35) at NodeFs.readFileSync
           (/Users/.../node_modules/@stencil/core/dist/sys/node/index.js:1:51986)
           at InMemoryFileSystem.readFileSync
           (/Users/.../node_modules/@stencil/core/dist/compiler/index.js:3522:39)
           at loadFile
           (/Users/.../node_modules/@stencil/core/dist/compiler/index.js:13637:39)
           at Object.requestBundle
           (/Users/.../node_modules/@stencil/core/dist/compiler/index.js:13631:17)
           at connectHostElement
           (/Users/.../node_modules/@stencil/core/dist/compiler/index.js:12901:13)
           at connectElement
           (/Users/.../node_modules/@stencil/core/dist/compiler/index.js:12882:17)
           at connectChildElements
           (/Users/.../node_modules/@stencil/core/dist/compiler/index.js:12871:13)
           at resolve
           (/Users/.../node_modules/@stencil/core/dist/compiler/index.js:13819:9)

The error could be reproduced with my repo: http://github.com/deckgo/deckdeckgo-docs

Btw. I do face the

[ WARN  ]  Bundling Warning
           Generated an empty bundle

too. Could that be the root of the problem?

What if prerender flag exists then on build time force all components to be shadow: false? and revert before building assets? :city_sunset:
Magic :D

--prerender freezes in the starter app w/ @stencil/core v0.18.1 & @stencil/router v0.3.3 as well, but I can confirm that setting shadow to false in all components fixes it and the app builds just fine.

My above issue is solved with Stencil >= v1

Was this page helpful?
0 / 5 - 0 ratings