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

Change env stringified so it doesn't overwrite process.env #611

Merged
merged 1 commit into from May 30, 2018

Conversation

tgriesser
Copy link
Contributor

@tgriesser tgriesser commented May 13, 2018

I believe this is part of the confusion around env vars and #528

With the current code, webpack's DefinePlugin sees the process.env variable as predefined entirely, 'process.env': .... If the env value doesn't exist webpack then inlines the entire stringified value object in the generated code.

With this change, we define each process.env.$VAR individually, which means that unknown variables will be left alone at build time.

If you add this in server.js:

console.log(process.env.ITEMS)
console.log(process.env.NODE_ENV)

Current behavior:

console.log(Object({"NODE_ENV":"development","PORT":"3000","VERBOSE":false,"HOST":"localhost","RAZZLE_ASSETS_MANIFEST":"/home/razzle-example/build/assets.json","BUILD_TARGET":"server","PUBLIC_PATH":"/","RAZZLE_PUBLIC_DIR":"/home/razzle-example/public"}).ITEMS);
console.log("development")

With this change:

console.log(process.env.ITEMS)
console.log("development")

@jaredpalmer
Copy link
Owner

Awesome! This looks very very promising. I need to run some tests on our infrastructure to check this out.

@jaredpalmer
Copy link
Owner

Testing this out right meow.

@jaredpalmer jaredpalmer merged commit 77e7796 into jaredpalmer:next May 30, 2018
@jaredpalmer
Copy link
Owner

LGTM

@tgriesser
Copy link
Contributor Author

Awesome! Thanks!

jaredpalmer added a commit that referenced this pull request May 30, 2018
* Webpack v4 (#525)

* (feat) Adds webpack v4, removes CommonsChunkPlugin and sets mode

* (feat) Yarn locks

* (feat) Removes NamedModulesPlugin and NoEmitOnErrorsPlugin

* (feat) Upgrades eslint-loader and replaces setup for before (devServer)

* (feat) Updates some loaders to work with webpack v4

* Add thread-loader, extract-text-webpack-plugin@beta.0

Adds thread-loader and extract-text-webpack-plugin beta.

* Remove automatic vendor bundling, add @todo

* Remove lock

* (fix) Fixes Inferno, JSXstyle, Reason, Typescript and WithVendor

* Fix TS HMR

* Bump to latest webpack

* Update README.md

* Move to Yarn Workspaces, fix tests

* Remove unused scripts for bootstrap and clean

* v2.0.0-alpha.1

* v2.0.0-alpha.2

* v2.0.0-alpha.3

* Drop extract-text for mini-css. Bump start-server (no more refreshes)

* Update docs with new hot restart behavior

* Make `rs` an h3 in docs

* v2.0.0-alpha.4

* Update package descriptions

* Bump mini-css-extract-plugin to 0.3.0 (#559)

* Add Multistep true so webpack 4 HMR can work (#558)

* Bump deps, fix TS example

* v2.0.0-alpha.5

* Changed name of the about page component: Home -> About (#561)

* chore(package): update lerna to version 2.9.1 (#560)

* including polyfills in production build (#562)

* Fix logic on polyfill inclusion

* v2.0.0-alpha.6

* Fix boolean

* v2.0.0-alpha.7

* s/your/you (#566)

* Replace clientCompiler before serverCompiler (#569)

* Update README.md (#564)

Fixed links to Node Inspector docs

* Add an example with Hyperapp (#549)

* Setup Hyperapp example

Enable HMR

Don't touch the yarn lock

Cleanup

Keep naming convention

Don't touch preact

Reverse formatting on the preact example

* Undo formatting something in the preact example

Fix formatting

Fix formatting

Fix formatting

Fix format

* 2.0.0-alpha.7

* Bump hyperapp version

* Add Koa usage example (#533)

* Add Koa usage example

* Extend Koa example documentation

* Make app use default koa styles and logo

* Correct Koa URL on doc

* Add webpack bar (#563)

* Remove yarn.lock from Koa example

* Bump deps

* v2.0.0-alpha.8

* add emitFile in url-loader options (#576)

* Add elm-package post on circleci

* Move elm install to dependencies.pre

* Use npm to install elm globally

* Install elm not elm-package. lol.

* Bump deps

* v2.0.0-y.0

* Update readme

* v2.0.0-alpha.9

* Limiting HMR to App (#577)

* #fix starting server code after compile assets (sync) (#575)

* Use webpack-dev-server-speedy for perf boost!

* v2.0.0-alpha.10

* Bump Webpack to 4.6.0

* v2.0.0-alpha.11

* Fix uglify options

* v2.0.0-alpha.12

* Update ESLint (#588)

* Upgrade typescript example (#589)

* ♻️ Cleanup random keystrokes in Home component

* ✨ Upgrade deps and TypeScript. Now supports the new fragment syntax<></>

* 👨🏼‍🎨 Add myself to the contributers list

* 📏 Prietier linting fixes

* Update README.md

* Update README.md

* Better defaults for Typescript example (#593)

* Better defaults for Typescript example

After running into multiple bugs having to deal with whether typescript was precompiling the same way that the babel version was (some include: jest testing, repl loading, mjs support) I realized that the big issue is that razzle had figured out solutions for each env based on webpack, so instead of having the added complexity of not knowing if I had proper typescript parody, I figured just remove that layer and use typescript for the one thing I wanted: type checking.

Happy to go into detail on those bugs, but I think the main point is this approach seems a better DX experiance out of the box, while offering more heavy solutions as comments.

* Update razzle.config.js

* Remove raf from examples (#601)

* Remove raf from all examples

* Add package-lock and yarn-lock to .gitignore in examples.

* Change env stringify so it doesn't overwrite process.env (#611)

* Razzle plugins + razzle-typescript-plugin (#605)

* Add a plugin system

* Add razzle-typescript-plugin

* Change TypeScript example to use razzle-typescript-plugin

* Small refactor to helpers

* Add myself to contributors

* Use fork-ts-checker-webpack-plugin instead of tslint-loader

* Make useBabel false by default

* Add esModuleInterop, remove console tslint rules

* Improve README

* Moved loaderFinder to razzle-dev-utils

* Remove -- from circle.yml

* Fix start test now that logger has changed

* Fix shell output

* Don't silence razzle build test

* Teardown beforeAll

* Remove 'use strict' from build fixtures
@s123121
Copy link

s123121 commented Jul 24, 2018

Any idea when we can have this pull request as a stable release? I really need this now to configure CI

jaredpalmer pushed a commit that referenced this pull request Oct 30, 2018
* v2 (#630)

* Webpack v4 (#525)

* (feat) Adds webpack v4, removes CommonsChunkPlugin and sets mode

* (feat) Yarn locks

* (feat) Removes NamedModulesPlugin and NoEmitOnErrorsPlugin

* (feat) Upgrades eslint-loader and replaces setup for before (devServer)

* (feat) Updates some loaders to work with webpack v4

* Add thread-loader, extract-text-webpack-plugin@beta.0

Adds thread-loader and extract-text-webpack-plugin beta.

* Remove automatic vendor bundling, add @todo

* Remove lock

* (fix) Fixes Inferno, JSXstyle, Reason, Typescript and WithVendor

* Fix TS HMR

* Bump to latest webpack

* Update README.md

* Move to Yarn Workspaces, fix tests

* Remove unused scripts for bootstrap and clean

* v2.0.0-alpha.1

* v2.0.0-alpha.2

* v2.0.0-alpha.3

* Drop extract-text for mini-css. Bump start-server (no more refreshes)

* Update docs with new hot restart behavior

* Make `rs` an h3 in docs

* v2.0.0-alpha.4

* Update package descriptions

* Bump mini-css-extract-plugin to 0.3.0 (#559)

* Add Multistep true so webpack 4 HMR can work (#558)

* Bump deps, fix TS example

* v2.0.0-alpha.5

* Changed name of the about page component: Home -> About (#561)

* chore(package): update lerna to version 2.9.1 (#560)

* including polyfills in production build (#562)

* Fix logic on polyfill inclusion

* v2.0.0-alpha.6

* Fix boolean

* v2.0.0-alpha.7

* s/your/you (#566)

* Replace clientCompiler before serverCompiler (#569)

* Update README.md (#564)

Fixed links to Node Inspector docs

* Add an example with Hyperapp (#549)

* Setup Hyperapp example

Enable HMR

Don't touch the yarn lock

Cleanup

Keep naming convention

Don't touch preact

Reverse formatting on the preact example

* Undo formatting something in the preact example

Fix formatting

Fix formatting

Fix formatting

Fix format

* 2.0.0-alpha.7

* Bump hyperapp version

* Add Koa usage example (#533)

* Add Koa usage example

* Extend Koa example documentation

* Make app use default koa styles and logo

* Correct Koa URL on doc

* Add webpack bar (#563)

* Remove yarn.lock from Koa example

* Bump deps

* v2.0.0-alpha.8

* add emitFile in url-loader options (#576)

* Add elm-package post on circleci

* Move elm install to dependencies.pre

* Use npm to install elm globally

* Install elm not elm-package. lol.

* Bump deps

* v2.0.0-y.0

* Update readme

* v2.0.0-alpha.9

* Limiting HMR to App (#577)

* #fix starting server code after compile assets (sync) (#575)

* Use webpack-dev-server-speedy for perf boost!

* v2.0.0-alpha.10

* Bump Webpack to 4.6.0

* v2.0.0-alpha.11

* Fix uglify options

* v2.0.0-alpha.12

* Update ESLint (#588)

* Upgrade typescript example (#589)

* ♻️ Cleanup random keystrokes in Home component

* ✨ Upgrade deps and TypeScript. Now supports the new fragment syntax<></>

* 👨🏼‍🎨 Add myself to the contributers list

* 📏 Prietier linting fixes

* Update README.md

* Update README.md

* Better defaults for Typescript example (#593)

* Better defaults for Typescript example

After running into multiple bugs having to deal with whether typescript was precompiling the same way that the babel version was (some include: jest testing, repl loading, mjs support) I realized that the big issue is that razzle had figured out solutions for each env based on webpack, so instead of having the added complexity of not knowing if I had proper typescript parody, I figured just remove that layer and use typescript for the one thing I wanted: type checking.

Happy to go into detail on those bugs, but I think the main point is this approach seems a better DX experiance out of the box, while offering more heavy solutions as comments.

* Update razzle.config.js

* Remove raf from examples (#601)

* Remove raf from all examples

* Add package-lock and yarn-lock to .gitignore in examples.

* Change env stringify so it doesn't overwrite process.env (#611)

* Razzle plugins + razzle-typescript-plugin (#605)

* Add a plugin system

* Add razzle-typescript-plugin

* Change TypeScript example to use razzle-typescript-plugin

* Small refactor to helpers

* Add myself to contributors

* Use fork-ts-checker-webpack-plugin instead of tslint-loader

* Make useBabel false by default

* Add esModuleInterop, remove console tslint rules

* Improve README

* Moved loaderFinder to razzle-dev-utils

* Remove -- from circle.yml

* Fix start test now that logger has changed

* Fix shell output

* Don't silence razzle build test

* Teardown beforeAll

* Remove 'use strict' from build fixtures

* Update README for v2

* v2.0.0

* Fix #632. Pass webpack to config in build.js

* v2.0.1

* 👨🏻‍💻 Include all contributors (#631)

* Removing thread-loader (#634)

* v2.0.2

* Include the crossorigin attribute link updated (#635)

reason: It seems that the content is moved since to this new URL.

* Adding server source map support (#516)

* Bump deps

* Boost perf of TS plugin during dev with suggested Outlook optimizations

* v2.0.3

* Fix useBabel use option in razzzle-plugin-typescript (#639)

* Add useEslint option to razzle-plugin-typescript (#640)

Useful if you wish to use babel, without eslint

* Update readme's

* v2.0.4

* Upgrade razzle package - jest ^22.4.3 (#648)

* Upgrade razzle package - jest ^22.4.3

* Revert version no change

* Close #653. Use correct Snyk badges

* Update babel-eslint to 8.x so that decorators will work using babel-plugin-transform-decorators-legacy. See: babel/babel-eslint#275 (#649)

* Add carrot to babel-eslint

* Remove consola (redundant)

* v2.1.0

* Add WebpackConfigHelpers + Vue, Elm plugins (#655)

* Add WebpackConfigHelpers + Vue, Elm plugins

* Fix elm plugin

* Add razzle-plugin-php

* Add disclaimer about php plugin

* More patches

* fix elm plugin

* Update elm

* Add info about razzle-plugin-elm

* Update docs

* v2.1.1

* Fix package names

* Fix 'server' typo (#658)

* latest jest (#656)

* Bump deps

* Squat on more potential plugins

* v2.2.0

* Bump babel-loader to remove incompatibility warning with Webpack 4. (#659)

* Fix Elm example (#661)

* preserve the full --inspect= flag as passed to yarn start (#660)

* preserve the full --inspect= flag as passed to yarn start instead of treating it as a boolean

* update --inspect docs & comments

* added example razzle + react router 3 (#539)

* added example razzle + react router 3

* Remove yarn.lock

* Fix pkg.json

* Add polka example (#520)

* Add polka example

Serves as a generic express middleware-compatible server example. (related to jaredpalmer/after.js#77)

* Remove with-polka/setupTests.js

* Remove yarn.lock

* Adding testEnvironmentOptions to supportedKeys for Jest (#678)

* fix koa hmr (#693)

* Add pretty node errors (#691)

* Ignore column from source map and only use pretty errors if file is read (#696)

* Add documentation for CSS Modules (#694)

* Erik Engi added to the contributors section (#700)

* Update README.md

* Introduce config.modifyBabelOptions (#702)

I’ve found that the babel configuration is important to modify in my environment.

Specifically in my env, I’d like to set `babelrc: false` so that the .babelrc file is ignored, and a custom babel configuration could be provided in the `razzle.config.js`.

* add support for function as plugin (#704)

* add mdx loader (#711)

* Mdx improve (#712)

* add peer dependency, ipdate install instruction

* update readme

* Fix .mjs issue with GraphQL 0.13.2 (#715)

* Fix .mjs issue with GraphQL 0.13.2

graphql/graphql-js#1272 (comment)

* Fix .mjs still referencing "require"

aws-amplify/amplify-js#686 (comment)

* remove package-lock.json

* Make readme's match

* v2.3.0

* Revert "v2.3.0"

This reverts commit 361bb0c.

* v2.4.0

* Fix production sourcemaps (#717)

* Create stale.yml

* Add loadable-components example (#598)

* Update createJestConfig.js (#719)

Add globals to the allowable jest config overrides

* Use the correct port when PORT is not set (#723)

* Add Now deployment example (#728)

* Duplicated basic example

* Renamed package name

* Updated readme for Now

* Added post Now build process hook

* Tweaked README format and content

* Add Heroku deployment example (#727)

* Duplicated basic exmaple

* Updated readme with Heroku instructions

* Renamed package name

* added Heroku post-build command in Procfile

* Updated package.json:
 - added post pre-start hook to trigger build on Heroku
 - moved razzle to main deps for Heroku build process

* Consistent reference to Heroku app name

* Update README.md

* Update package.json

* Update README.md

* Fix for '[HMR] You need to restart the application!' on server sided err

* Mdx plugin improvements (#732)

* resolving path to @mdx-js/tag, fix loader options

* del peerDep, improve readme

* add example

* Change import to require

* cleanup: remove .js extensions from require

* React Loadable example: add css chunks (#746)

* point people looking at CHANGELOG.md to the release notes page (#747)

* Update css chunks: use [name] instead of [id] (#750)

* Fix HMR : client was not working + mismatch between server/client (#749)

* remove mention of extract text plugin from react native web example (#752)

* Update examples to recover from HMR error (#763)

* add CLIENT_PUBLIC_PATH env var for local dev environments that don't use localhost (e.g. VMs, Docker) (#761)

* Set template package version back to 0.1.0 (#760)

* CLIENT_PUBLIC_PATH default was being set in two places that computed different values. Remove the erroneous one. (#779)

* Correct example name in curl (#772)

* Feature/scss plugin (#786)

* add scss plugin and fixes to makeLoaderFinder

* add readme for scss plugin

* fix test regex for including .css

* remove jest forceExit

* add contributors

* refactor tests

* add plugin options

* edit readme for better options knowledge

* change node-sass to node-sass-chokidar

* Use npx (#783)
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

Successfully merging this pull request may close these issues.

None yet

3 participants