stencil

stencil copied to clipboard

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:

Not sure if this is feature just not available in the current release since there's not much documentation on it, but I'm using the Env variable exported by @stencil/core, and the environment variables I set in stencil.config.js are not available in the project.

Expected behavior: I expect environment variables to be made available at runtime via the Env variable from @stencil/core.

Steps to reproduce: See the related code below. Please let me know if you need more details.

Related code:

stencil.config.js

...

export const config: Config = {
  ...
  hashFileNames: true,
  plugins: [sass(), inlineSvg()],
  env: {
    'foo': 'bar'
  },
  buildEs5: true,
  extras: {
    safari10: true,
  },
};

MyComponent.tsx

import { Component, Prop, h, Element, State, Watch, Env } from '@stencil/core';

...

function getEnvVar(relPath: string) {
  console.log('Env.foo is ' + Env.foo);
}

Other information:

Related test cases: https://github.com/ionic-team/stencil/tree/master/test/end-to-end/src/env-data

Hi! Pretty sure Env variables are compile time only. Try assigning to a class property (for example) then logging that

Hi @stephahart - I'm going to mark this as needs investigation. We may also need to update the docs here if what John is saying is true as well... I have a hunch this may turn out to be a bug or even be a design decision that we may need to reconsider.

FWIW, for environment variables I've used the rollup-plugin-replace plugin to replace code in TypeScript, and even to replace JS files in the app like so

Is this working for you? I am not able to find a solution for using env

~FWIW it seems to work for the dist output target but not for dist-custom-elements~

Actually that makes sense since dist-custom-elements is consumed by other bundlers (webpack/rollup ..) and so they won't read the lib stencil.config.ts. Need to actually replace code with rollup plugins i suppose