<p dir="auto">Hello! I've scoured through other issues and can't figure out why the warning is still around because it feels like I've done everything. Here's the setup:</p>
<p dir="auto">Build scripts</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="    &quot;heroku-postbuild&quot;: &quot;npm run build:prod&quot;,
    &quot;build:webpack&quot;: &quot;webpack --progress --display-error-details --bail&quot;,
    &quot;build:dev&quot;: &quot;npm run build:webpack -- --config config/webpack/development.config.js&quot;,
    &quot;build:prod&quot;: &quot;NODE_ENV=production npm run build:webpack -- --config config/webpack/production.config.js&quot;,"><pre class="notranslate"><code class="notranslate">    "heroku-postbuild": "npm run build:prod",
    "build:webpack": "webpack --progress --display-error-details --bail",
    "build:dev": "npm run build:webpack -- --config config/webpack/development.config.js",
    "build:prod": "NODE_ENV=production npm run build:webpack -- --config config/webpack/production.config.js",
</code></pre></div>
<p dir="auto"><code class="notranslate">base.config.js</code>:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="config.plugins = [
  new webpack.optimize.OccurenceOrderPlugin(),
  new webpack.DefinePlugin({
    //sets up some other constants on process.env
  }),
];"><pre class="notranslate"><code class="notranslate">config.plugins = [
  new webpack.optimize.OccurenceOrderPlugin(),
  new webpack.DefinePlugin({
    //sets up some other constants on process.env
  }),
];
</code></pre></div>
<p dir="auto"><code class="notranslate">production.config.js</code>:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="var config = extend({}, baseConfig);

config.plugins.push(
  new webpack.DefinePlugin({
    &quot;process.env.NODE_ENV&quot;: JSON.stringify(&quot;production&quot;),
  }),
  new webpack.optimize.UglifyJsPlugin({
    mangle: true,
    compress: { warnings: false },
    output: { comments: false },
    exclude: [/\.min\.js$/gi]
  }),
  new webpack.optimize.DedupePlugin(),
//some more plugins"><pre class="notranslate"><code class="notranslate">var config = extend({}, baseConfig);

config.plugins.push(
  new webpack.DefinePlugin({
    "process.env.NODE_ENV": JSON.stringify("production"),
  }),
  new webpack.optimize.UglifyJsPlugin({
    mangle: true,
    compress: { warnings: false },
    output: { comments: false },
    exclude: [/\.min\.js$/gi]
  }),
  new webpack.optimize.DedupePlugin(),
//some more plugins
</code></pre></div>
<p dir="auto">Using React v15.4.2 and Webpack v1.14.0. I'm not sure what I'm missing -- DefinePlugin and UglifyJsPlugin seem to be declared properly, and the <code class="notranslate">NODE_ENV</code> is set to production up in the script. Any help would be greatly appreciated! Thank you!</p>
<p dir="auto">I ran into a strange problem when transitioning to React <code class="notranslate">0.14.0</code>.</p>
<p dir="auto">I use a promisified API internally in my application, and for various reasons I need a handle to the mounted instance of an element. No big deal, this is how I get a handle to that instance after react has finished its non-deterministic render:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="// some renderer service
return new Promise(function (resolve, reject) {
    React.render(reactElement, node, function () {
        resolve(this)
    })
})

// someone using the renderer service
return renderer(element, someNode)
    .then(function (mountedElement) {
        ...
    })"><pre class="notranslate"><code class="notranslate">// some renderer service
return new Promise(function (resolve, reject) {
    React.render(reactElement, node, function () {
        resolve(this)
    })
})

// someone using the renderer service
return renderer(element, someNode)
    .then(function (mountedElement) {
        ...
    })
</code></pre></div>
<p dir="auto">When I update to <code class="notranslate">0.14.0</code>, I should be able to just swap out implementations without a thought, right?</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="return new Promise(function (resolve, reject) {
    ReactDOM.render(reactElement, node, function () {
        resolve(this)
    })
})"><pre class="notranslate"><code class="notranslate">return new Promise(function (resolve, reject) {
    ReactDOM.render(reactElement, node, function () {
        resolve(this)
    })
})
</code></pre></div>
<p dir="auto">Well, apparently not :(.</p>
<p dir="auto">I'm getting an error message correlating to <a href="https://gist.github.com/jimfb/4faa6cbfb1ef476bd105">this help wiki</a>...</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="Uncaught Error: Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's `render` method, or you have multiple copies of React loaded (details: https://fb.me/react-refs-must-have-owner)."><pre class="notranslate"><code class="notranslate">Uncaught Error: Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's `render` method, or you have multiple copies of React loaded (details: https://fb.me/react-refs-must-have-owner).
</code></pre></div>
<p dir="auto">I have scraped through the app looking for some "invalid usage of refs", but there aren't any. I also can't see a case where I have more than one React on the page (unless there's some shenanigans caused by including <code class="notranslate">react-dom/server</code> in a browser, but I have removed it and checked against that case too: same problem)?</p>
<p dir="auto">Loading React (browserify):</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="    let React = require('react')
    let ReactDOM = require('react-dom')
    let Server = require('react-dom/server')"><pre class="notranslate"><code class="notranslate">    let React = require('react')
    let ReactDOM = require('react-dom')
    let Server = require('react-dom/server')
</code></pre></div>
<p dir="auto">package.json</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="  &quot;dependencies&quot;: {
    &quot;react&quot;: &quot;0.14.0&quot;,
    &quot;react-dom&quot;: &quot;0.14.0&quot;
  }"><pre class="notranslate"><code class="notranslate">  "dependencies": {
    "react": "0.14.0",
    "react-dom": "0.14.0"
  }
</code></pre></div>
<p dir="auto"><code class="notranslate">npm ls | grep react</code></p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="│ │ ├── babel-plugin-react-constant-elements@1.0.3
│ │ ├── babel-plugin-react-display-name@1.0.3
│ │ ├── babel-plugin-react-constant-elements@1.0.3
│ │ ├── babel-plugin-react-display-name@1.0.3
├─┬ react@0.14.0
├─┬ react-dom@0.14.0
│ └─┬ react@0.14.0"><pre class="notranslate"><code class="notranslate">│ │ ├── babel-plugin-react-constant-elements@1.0.3
│ │ ├── babel-plugin-react-display-name@1.0.3
│ │ ├── babel-plugin-react-constant-elements@1.0.3
│ │ ├── babel-plugin-react-display-name@1.0.3
├─┬ react@0.14.0
├─┬ react-dom@0.14.0
│ └─┬ react@0.14.0
</code></pre></div>