Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

This addon is incompatible with ember-cli@2.16.0-beta.2+ #30

Closed
lolmaus opened this issue Oct 8, 2017 · 47 comments
Closed

This addon is incompatible with ember-cli@2.16.0-beta.2+ #30

lolmaus opened this issue Oct 8, 2017 · 47 comments

Comments

@lolmaus
Copy link

lolmaus commented Oct 8, 2017

Hi.

Suddenly After updating to ember-cli@2.16.0-beta.2, ember-cli-dotenv stopped passing environment variables. In config/environment.js, process.env does not contain env vars from the dot-env file.

This happened to existing commits that have been working previously. My app uses Yarn with a proper lockfile, so I think it may be something with my OS.

Please help me debug this and figure out the reason.

@lolmaus
Copy link
Author

lolmaus commented Oct 8, 2017

Tried running addon tests, but they fail with Uncaught TypeError: $ is not a function.

@lolmaus
Copy link
Author

lolmaus commented Oct 8, 2017

OK, I've figured it out. The problem is caused by this PR in ember-cli: ember-cli/ember-cli#7333

Before this PR, my app's environment.js and ember-cli-dotenv's config hook are executed multiple times alternately

After the PR, each is executed only once -- and environment.js goes first. The config hook is executed after env vars are passed into the app.

Looks like, this addon's index.js has to be updated in order for the logic to be executed in time.

@lolmaus lolmaus changed the title Suddenly stopped working on local machine This addon is incompatible with ember-cli@2.16.0-beta.2+ Oct 8, 2017
@lolmaus lolmaus changed the title This addon is incompatible with ember-cli@2.16.0-beta.2+ This addon is incompatible with ember-cli@2.16.0-beta.2+ Oct 8, 2017
@lolmaus
Copy link
Author

lolmaus commented Oct 8, 2017

Uhm... Turns out I don't need this addon. O-o

I replaced it with:

  • ember-cli-build.js: dotenv.config({path})
  • config/environment.js: envVars: _.pick(process.env, ['MY_ALLOWED_KEY'])

And it works correctly in ember-cli@2.16.0-beta.2.

@jeffrey008
Copy link

Hi @lolmaus can you be more specific about that? I am upgrading ember-cli to 2.16 and this starts breaking. :(
You said you don't need this addon and did some replacements. Please teach me

@lolmaus
Copy link
Author

lolmaus commented Oct 10, 2017

@jeffrey008

  1. In terminal:

    npm uninstall ember-cli-dotenv
    npm install -D dotenv lodash
    
  2. In your ember-cli-build.js, do this:

    const dotenv = require ('dotenv')
    dotenv.config() // You can also provide the path to a specific dotenv file: dotenv.config({path: '.env.prod'})

    This will make env vars from your dotenv file available in the process.env.

  3. In your config/environment.js, do this:

    const _ = require 'lodash'
    
    const ENV = {
      envVars: _.pick(process.env, [
        'BACKEND_URL',
        'GITHUB_API_KEY',
      ])
    }
  4. Then in your app you can do this:

    import ENV from '<your-app-name>/config/environment'
    
    export default JSONAPIAdapter.extend({
      host: ENV.envVars.BACKEND_URL
    })

@rmachielse
Copy link

I think it would still be nice to fix this addon. Do you also notice the config is being corrected when you save the config/environment.js file (even without changes)? The application then reloads with correct values

@bradhaydon
Copy link

@rmachielse I am also experiencing the same problem. I would also greatly appreciate if someone would be able to fix this addon.

@sumeetattree
Copy link

I am facing the same issue as of ember-cli 2.16. env variables aren't picked up on their own. A temporary workaround is to save your environment.js while ember s is running. This should pick up the environment variables.

@SergeAstapov
Copy link
Collaborator

SergeAstapov commented Oct 12, 2017

For ember-cli@2.16+ we should use clientAllowedKeys in ember-cli-build.js as described in docs:

Put a .env file in the root of your repository:

DROPBOX_KEY=YOURKEYGOESHERE
Next, put some configuration in your ember-cli-build.js. Starting in 0.2.0, client side keys must be explicitly allowed:

// ember-cli-build.js

module.exports = function(defaults) {
  var app = new EmberApp(defaults, {
    dotEnv: {
      clientAllowedKeys: ['DROPBOX_KEY']
    }
  });

  return app.toTree();
};

This works fine and env variables listed in clientAllowedKeys are get populated in <app name>/config/environment.

Following not gonna work for ember-cli@2.16+

All keys in .env are currently injected into node’s process.env. These will be available in your config/environment.js file:

// config/environment.js
module.exports = function(environment){
  return {
    MY_OTHER_KEY: process.env.MY_OTHER_KEY
  }
};

@lolmaus could you please try following steps for your use case:

  1. In your ember-cli-build.js, do this:
module.exports = function(defaults) {
  var app = new EmberApp(defaults, {
    dotEnv: {
      clientAllowedKeys: ['BACKEND_URL', 'GITHUB_API_KEY']
    }
  });

  return app.toTree();
};

This will make env vars from your dotenv file available in the <your-app-name>/config/environment.

  1. Then in your app:
import ENV from '<your-app-name>/config/environment'

export default JSONAPIAdapter.extend({
  host: ENV.BACKEND_URL
});

@SergeAstapov
Copy link
Collaborator

Failing build is addressed in #29

@sumeetattree
Copy link

sumeetattree commented Oct 12, 2017

@SergeAstapov I have tried making changes as you suggested. My ember-cli-build.js file:

...
let app = new EmberApp(defaults, {
    dotEnv: {
      clientAllowedKeys: ['API_HOST', 'ASSET_HOST', 'REDIS_URL', 'SOCKET_URL',
        'S3_BUCKET_NAME', 'AWS_REGION', 'AWS_ACCESS_KEY_ID', 'AWS_SECRET_ACCESS_KEY'],
      path: {
        development: '.env.development',
        'development-postbuild': '.env.development'
      }
    },    
    fingerprint: {
      prepend: process.env.ASSET_HOST,
      enabled: true
    },
...

Things to note:

  • I am using fingerprinting as a part of ember-cli-deploy development workflow. That's what that development-postbuild key is for. I am just testing things out here.
  • I do not have a main .env file. console.log(process.env) in ember-cli-build.js does not print any of the environment variables.
  • None of the .env.* files are loaded.

Edit:
This issue:

I am facing the same issue as of ember-cli 2.16. env variables aren't picked up on their own. A temporary workaround is to save your environment.js while ember s is running. This should pick up the environment variables.

still persists

@SergeAstapov
Copy link
Collaborator

SergeAstapov commented Oct 12, 2017

@sumeetattree are you able to access any of variables listed in clientAllowedKeys within your Ember app code? e.g. in some adapter like

import ENV from '<your-app-name>/config/environment'

export default JSONAPIAdapter.extend({
  host: ENV.API_HOST
});

I actually was not using process.env within ember-cli-build.js file and I'm not sure it's supposed to work that way. Was it working for you for ember-cli <= 2.15?

@sumeetattree
Copy link

@SergeAstapov

@sumeetattree are you able to access any of variables listed in clientAllowedKeys within your Ember app code? e.g. in some adapter like

After running ember s for the first time, no.

import config from '../config/environment.js;
console.log(config);
// This returns a config object without any of the environment variables.

Only after I hit save in environment.js after ember s and wait for the server to reload is when I see the environment variables. If I refresh the browser without waiting for the server to auto reload I am back to square one. And then you have to repeat the process.

I actually was not using process.env in ember-cli-build.js file and I'm not sure it's supposed to work that way. Was it working for you for ember-cli <= 2.15?

Yes this was working for ember-cli <= 2.15.

@jeanduplessis
Copy link

@SergeAstapov while I can confirm that the values from our .env file gets added to environment config, we were previously using process.env.KEY_NAME in environment.js to set variables in a structure that other addons might expect.

For example ember-intercom-api expects you to set the following:

ENV['ember-intercom-api'] = {
  appId: '[YOUR_APP_ID]'
};

and we were setting it as such:

ENV['ember-intercom-api'] = {
  appId: process.env.INTERCOM_APP_ID
};

Also we don't use .env files on our production server so we rely on accessing the info via process.env.XXX so that it works both during local development as well as on production.

@jamesdixon
Copy link

I was able to use @lolmaus fix, but unfortunately, it causes problems with ember-cli-deploy. ember-cli-deploy has built-in .env support and will pick the correct .env file based on the configuration. Unfortunately, adding the dotenv.config() statements manually seems to choose the default .env file regardless.

A fix is needed for this package. I'm going to look into it.

@jamesdixon
Copy link

@SergeAstapov I tried your fix with clientAllowedKeys and no go. I've been using the addon up until 2.16 without clientAllowedKeys with no problem. I actually prefer not having to use that key to selectively import keys.

@SergeAstapov
Copy link
Collaborator

SergeAstapov commented Oct 17, 2017

@jamesdixon @jeanduplessis seems I do have a fix - as some extra caching has been implemented for Ember CLI, file .env should be read from file system at earlier stage.

Added fix to #29 that allows to access process.env.INTERCOM_APP_ID from within /config/environment.

Could @jamesdixon @jeanduplessis you try it via npm install SergeAstapov/ember-cli-dotenv#update-ember-cli --save-dev?

@jamesdixon
Copy link

@SergeAstapov thank you! I'll give it a shot

@jamesdixon
Copy link

@SergeAstapov unfortunately, this oddly still doesn't work for me.

If I do a console.log(ENV) in the last line of my environment.js file right before the return, I can see the keys I've allowed in `clientAllowedKeys' being made available, but they're still undefined when accessing them through my app...

Any thoughts?

@jamesdixon
Copy link

@SergeAstapov i actually just reverted to the latest version of the original addon and am still seeing the behavior i mentioned above. that said, was your branch up to date or maybe just had no affect overall?

I did add a logging statement to my environment.js file to log the API_URL variable and see that it attempt to output it 3 times. I'm not sure if this is just Ember cycling through environemnts, but wanted to mention it.

API_URL: undefined
API_URL: undefined
Livereload server on https://localhost:7020
API_URL: https://localhost:3001

@jamesdixon
Copy link

If I log out the contents of my environment within the app, none of the keys I have set that reference an environment variable are present.

@SergeAstapov
Copy link
Collaborator

SergeAstapov commented Oct 17, 2017

@jamesdixon could you ping me in Slack? The same user name (sergeastapov) as on github.

I wonder if I missing anything - it works fine for me and dummy app config seems to pass the test with no issues.

Just FYI I'm not an addon maintainer, just was working on brining FastBoot support and at the same time Ember CLI was out and brought this issue.

@jamesdixon
Copy link

@SergeAstapov ember slack channel?

Regarding the dummy app config, have you tried accessing IN_PROCESS_ENV in the code somewhere (not just in the test)?

@jeanduplessis
Copy link

jeanduplessis commented Oct 17, 2017

@SergeAstapov unfortunately the fix on your branch isn't working for me.

Here's the output from logging a process.env variable in config/environment.js:

1.2.0

$ ember s
undefined
undefined
undefined
Livereload server on https://localhost:7020
undefined

SergeAstapov/ember-cli-dotenv#update-ember-cli

$ ember s
undefined
undefined
undefined
Livereload server on https://localhost:7020
jln4i7cl

While the value is eventually set, when running your branch with the fix, unfortunately it doesn't seem to be set by the time Ember reads the values to write it to the meta tag on the index.html page.

@SergeAstapov
Copy link
Collaborator

SergeAstapov commented Oct 17, 2017

@jeanduplessis for some reason ember build and ember s works differently:

  1. define a variable SOME_VAR_NAME in .env like
SOME_VAR_NAME=jln4i7cl
  1. install addon from SergeAstapov/ember-cli-dotenv#update-ember-cli
  2. change config/environment.js like
ENV['APP_VAR_NAME'] = process.env.SOME_VAR_NAME;
console.log(process.env.SOME_VAR_NAME);

After these steps do ember build and you should see process.env.SOME_VAR_NAME variable value in meta tag in the dist/index.html file:

<meta name="dummy/config/environment" content="{ ... "APP_VAR_NAME": "jln4i7cl" ... }" />

And CLI console output would be:

undefined
jln4i7cl
jln4i7cl

If you then would do ember s CLI console output would be:

undefined
undefined
Proxying to https://example.com
Livereload server on http://localhost:35129
jln4i7cl

and you would not see process.env.SOME_VAR_NAME variable value in meta tag in the dist/index.html file until you do some change and app is re-build.

What is current addon behavior:

read .env file in config() hook of addon.
ember-cli <= 2.15 invoked config/environment.js file multiple times. Even after config() hook of this addon.
So as a result process.env variables from .env file would became available next time config/environment.js is included.
Change introduced in ember-cli@2.16 reads config/environment.js once and prior to config() hook of any addon.

What was implemented in SergeAstapov/ember-cli-dotenv#update-ember-cli

read .env file in included() hook of addon
This change still does not seem to solve the issue completely.

What could be done else:

read .env file in init() hook of addon.
Problem would be that ember-cli-build.js is not invoked yet and we do not have access to neither dotEnv configuration options within ember-cli-build.js nor we do not know what is the environment name build is running in (like development, test or production).
This would allow us to read .env file in project root prior to ember-cli-build.js or config/environment.js file is included and executed so process.env would be available in config/environment.js.

But on the other hand this change would prevent anyone from using custom .env file path or have per environment .env files (which does not considered as best practice at all, see dotenv README.md).

Simple solution

Do not use process.env within config/environment.js
You can continue to use an addon with clientAllowedKeys as described in https://github.com/fivetanley/ember-cli-dotenv#what-is-ember-cli-dotenv.
This would work in simple use cases but would not allow you to put some variable from .env into nested object.

I can't see any better solution then what I have already implemented in SergeAstapov/ember-cli-dotenv#update-ember-cli. If anyone has any suggestions - would be glad to help.

Would be great to hear from @fivetanley who is original addon author.

@jeanduplessis
Copy link

@SergeAstapov thanks for all your effort on this. I'm likely going to have to consider some alternative approaches to dealing with our specific requirements. I think that in the light of your findings and improvements this issue can likely be closed off - maybe a note in the README file about not relying on process.env.XXX will suffice.

@fivetanley
Copy link
Owner

@SergeAstapov I think that sounds fine. Maybe we should recommend using dotenv directly in either ember-cli-build.js or config/environment.js as an alternative to using this addon in the README?

Would you or @lolmaus like commit bit/npm rights on this addon? I'm not actively using/working on it anymore.

@jasonmit
Copy link
Collaborator

jasonmit commented Oct 18, 2017

I have a fork going that moves the configuration out of ember-cli-build, which resolves this issue for now. https://github.com/jasonmit/ember-cli-dotenv

Readme diff summarizes the changes: jasonmit@b055555#diff-04c6e90faac2675aa89e2176d2eec7d8

@fivetanley feel free to fold these changes in if you want. Otherwise I'll continue to maintain the fork for others.

@SergeAstapov
Copy link
Collaborator

SergeAstapov commented Oct 19, 2017

@fivetanley sounds good to me, would be glad to help!

Approach suggested by @jasonmit with dotenv.js config file in project root seems solves the issue.

@jasonmit was you able to access env name within init hook of addon? this.env on line #26 evaluates to undefined for me, as a result it does not support per environment config files.

@jasonmit
Copy link
Collaborator

@SergeAstapov I just released 2.0.1 to resolve this. Thanks for pointing that out.

@fivetanley
Copy link
Owner

@jasonmit I added you and @SergeAstapov as collaborators on this repo. a 2.x release sounds great. It sounds like you have solved the issues on your fork? Feel free to merge those in.

@oxodesign
Copy link
Contributor

@jasonmit @SergeAstapov will you create a pull request and fix the issue here as well?

@jasonmit
Copy link
Collaborator

jasonmit commented Oct 27, 2017

@oxodesign changes are in master and will be published soon.

@jeanduplessis
Copy link

PS: just to let you know I'm running master and its working beautifully. Thanks @jasonmit

@bravo-kernel
Copy link

Good job people, a new release would be more than welcome.

@jasonmit
Copy link
Collaborator

jasonmit commented Nov 4, 2017

@fivetanley can you grant @SergeAstapov and myself npm access so we can cut a release?

@lolmaus
Copy link
Author

lolmaus commented Nov 5, 2017

I suggest that we move dotenv.js into the config/ subdir.

@lolmaus
Copy link
Author

lolmaus commented Nov 5, 2017

When I run ember t -s, the dotenv.js function receives "development" as the argument, I expect "test".

@jeanduplessis
Copy link

@lolmaus I'm also getting development instead of test. Explicitly setting the environment with --environment=test seems to work for now.

@SergeAstapov
Copy link
Collaborator

Hi @lolmaus @jeanduplessis! Thanks for feedback!
I've addressed these in #37 and #38.

@oxodesign
Copy link
Contributor

I have a addon that does set an key back to env. the code is:

config: function(env, baseConfig) {
    return {mySpecialKey: "test"}};
}

Installed ember-cli-dotenv from master, did npm cache clean and npm install, when run ember s on my app I could not get access to mySpecialKey, while the app was running if I changed "config/dotenv.js" looks like the configuration reloades and I can use mySpecialKey.

What can I do in this case?

@oxodesign
Copy link
Contributor

I was using included()-function on the addon. Moved the logic over to init() and it worked :)

@SergeAstapov
Copy link
Collaborator

@fivetanley can you grant @jasonmit and myself npm access so we can cut a release?

@kjhangiani
Copy link

@SergeAstapov @jasonmit thanks for the awesome work through this thread - was tracing a few subtle bugs for a while, finally realized it was dotenv, and stumbled on this thread. After upgrading and migrating, everything works again.

Appreciate all the hard work!

@fivetanley
Copy link
Owner

@SergeAstapov @jasonmit sorry for the delay, you both have publish rights on npm. thanks so much for your help

@SergeAstapov
Copy link
Collaborator

Thank you @fivetanley! Version 2.0 has been pushed to npm! 🎉

Thank you all for the help, feedback and patience!

@jamesdixon
Copy link

Has anyone gotten this updated version to work properly with ember-cli-deploy? I keep getting development variables rather than my other environments.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests