bug: receive error '$t is not a constructor' when running cli

[rayboschbr]

Prerequisites

• [X] I have read the Contributing Guidelines.
• [X] I agree to follow the Code of Conduct.
• [X] I have searched for existing issues that already report this problem, without success.

Create Stencil Version

3.2.0

Current Behavior

Running npm init stencil fails with :

✖ $t is not a constructor

Expected Behavior

The expectation is that it creates a new stencil project starter.

Steps to Reproduce

Run the following:

npm install create-stencil@latest npm init stencil

Additional Information

OS: Windows 10 Node Version: 18.12.1 NPM Version: 8.19.2

[rwaskiewicz]

Hey @rayboschbr 👋

Thanks for the bug report! I'm unable to reproduce this locally on my Windows machine with those versions of Node and npm. Can you help us out and provide a few additional bits of information for us?

1. What is the output of npm init stencil -- --info
2. Can you post the whole stack trace that you're seeing?
3. What starter are you using? Component? App? Something else?
4. Does npm init stencil@3.2.0 component hello-world reproduce this issue?

Thanks!

[ionitron-bot[bot]]

Thanks for the issue! This issue has been labeled as needs reproduction. This label is added to issues that need a code reproduction.

Please provide step-by-step instructions to reproduce your error. Be sure to include your operating system, node version, the shell you are using, and any other information that you feel may be useful in reproducing the error.

If you have already provided a instructions and are seeing this message, it is likely that the instructions were not enough for our team to reproduce the issue.

For a guide on how to create a good reproduction, see our Contributing Guide.

[rayboschbr]

Hey, sorry for the long wait. The starter I'm trying to use is the component one.

This is how it looks like when I try to create something using npm init stencil

MER2JVL@CA-C-000QM MINGW64 /c/repos/azure/new-spark
$ npm init stencil
npm WARN exec The following package was not found and will be installed: create-stencil@3.2.0

? Select a starter project.

Starters marked as [community] are developed by the Stencil Community,
rather than Ionic. For more information on the Stencil Community, please see
https://github.com/stencil-community » - Use arrow-keys. Return to submit.
>   component                Collection of web components that can be used anywhere
    app [community]          Minimal starter for building a Stencil app or website
    ionic-pwa [community]    Ionic PWA starter with tabs layout and routes

√ Select a starter project.

Starters marked as [community] are developed by the Stencil Community,
rather than Ionic. For more information on the Stencil Community, please see
https://github.com/stencil-community » component                Collection of web components that can be used anywhere
? Project name » spark-ui
√ Project name ... spark-ui
? Confirm? » (Y/n)y
√ Confirm? ... yes

✖ $t is not a constructor

npm ERR! code 1
npm ERR! path C:\repos\azure\new-spark
npm ERR! command failed
npm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c create-stencil

npm ERR! A complete log of this run can be found in: C:\Users\mer2jvl\AppData\Local\npm-cache\_logs\2023-07-20T12_28_44_230Z-debug-0.log

Running npm install stencil -- --info produces the results below:

MER2JVL@CA-C-000QM MINGW64 /c/repos/azure/new-spark
$ npm init stencil -- --info
create-stencil: 3.2.0

The output of the log generated after trying to run npm init stencil produces the following:

0 verbose cli C:\Program Files\nodejs\node.exe C:\Users\mer2jvl\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js
1 info using npm@9.7.2
2 info using node@v18.12.1
3 timing npm:load:whichnode Completed in 4ms
4 timing config:load:defaults Completed in 4ms
5 timing config:load:file:C:\Users\mer2jvl\AppData\Roaming\npm\node_modules\npm\npmrc Completed in 3ms
6 timing config:load:builtin Completed in 4ms
7 timing config:load:cli Completed in 1ms
8 timing config:load:env Completed in 1ms
9 timing config:load:file:C:\repos\azure\new-spark\.npmrc Completed in 0ms
10 timing config:load:project Completed in 6ms
11 timing config:load:file:C:\Users\mer2jvl\.npmrc Completed in 2ms
12 timing config:load:user Completed in 2ms
13 timing config:load:file:C:\Users\mer2jvl\AppData\Roaming\npm\etc\npmrc Completed in 2ms
14 timing config:load:global Completed in 2ms
15 timing config:load:setEnvs Completed in 1ms
16 timing config:load Completed in 21ms
17 timing npm:load:configload Completed in 21ms
18 timing config:load:flatten Completed in 2ms
19 timing npm:load:mkdirpcache Completed in 3ms
20 timing npm:load:mkdirplogs Completed in 3ms
21 verbose title npm init stencil
22 verbose argv "init" "stencil"
23 timing npm:load:setTitle Completed in 1ms
24 timing npm:load:display Completed in 0ms
25 verbose logfile logs-max:10 dir:C:\Users\mer2jvl\AppData\Local\npm-cache\_logs\2023-07-20T12_34_52_785Z-
26 verbose logfile C:\Users\mer2jvl\AppData\Local\npm-cache\_logs\2023-07-20T12_34_52_785Z-debug-0.log
27 timing npm:load:logFile Completed in 11ms
28 timing npm:load:timers Completed in 0ms
29 timing npm:load:configScope Completed in 0ms
30 timing npm:load Completed in 107ms
31 timing arborist:ctor Completed in 0ms
32 silly logfile done cleaning log files
33 http fetch GET 200 https://registry.npmjs.org/create-stencil 1887ms (cache revalidated)
34 timing arborist:ctor Completed in 0ms
35 timing arborist:ctor Completed in 0ms
36 timing command:init Completed in 12350ms
37 verbose stack Error: command failed
37 verbose stack     at ChildProcess.<anonymous> (C:\Users\mer2jvl\AppData\Roaming\npm\node_modules\npm\node_modules\@npmcli\promise-spawn\lib\index.js:53:27)
37 verbose stack     at ChildProcess.emit (node:events:513:28)
37 verbose stack     at maybeClose (node:internal/child_process:1091:16)
37 verbose stack     at ChildProcess._handle.onexit (node:internal/child_process:302:5)
38 verbose cwd C:\repos\azure\new-spark
39 verbose Windows_NT 10.0.19045
40 verbose node v18.12.1
41 verbose npm  v9.7.2
42 error code 1
43 error path C:\repos\azure\new-spark
44 error command failed
45 error command C:\WINDOWS\system32\cmd.exe /d /s /c create-stencil
46 verbose exit 1
47 timing npm Completed in 13966ms
48 verbose code 1
49 error A complete log of this run can be found in: C:\Users\mer2jvl\AppData\Local\npm-cache\_logs\2023-07-20T12_34_52_785Z-debug-0.log

I'm not able at this time to generate a reproduction repository since I cannot even get started with the initial commit.

Would there be anything else I can provide?

[rwaskiewicz]

@rayboschbr By any chance do you have https_proxy set as an environment variable? I was able to reproduce this error this afternoon by setting that env var like so:

https_proxy=1 node index.js component tmp-component-starter 

[rayboschbr]

@rwaskiewicz yes, I work at a company that uses proxy so need to have both HTTP and HTTPS proxy variables set. Is there a way to make it work even behind a corporate proxy wall ?

[rwaskiewicz]

@rayboschbr If https_proxy is being set, I think that is the issue. This appears to be occurring whenever this global variable is set, we attempt to create a proxy agent based on the value assigned to that environment variable, even if its a valid one.

Can you try using this dev build and let me know if this works for you?

npm init stencil@3.3.0-dev.1690219375.3bb3b0c

I'm not sure if you're explicitly setting https_proxy or not - if you are, can you use:

https_proxy=YOUR_PROXY npm init stencil@3.3.0-dev.1690219375.3bb3b0c

[rayboschbr]

With this one it works, even tho I'm using the corporate proxy.

[rwaskiewicz]

Excellent! I'll put up a pull request with the changes in that dev build for the next release of this CLI

[rayboschbr]

Thanks a lot!

[rwaskiewicz]

The fix for this issue has been merged and is a part of the v3.3.1 release