未捕获的 ReferenceError:全局未在 eval 中定义

Posted

技术标签:

【中文标题】未捕获的 ReferenceError:全局未在 eval 中定义【英文标题】:Uncaught ReferenceError: global is not defined at eval 【发布时间】:2017-12-23 12:39:30 【问题描述】:

我遇到了一个我认为来自 webpack 的错误。这里是:

index.js:9 Uncaught ReferenceError: global is not defined
    at eval (index.js:9)
    at Object.<anonymous> (bundle.js:2548)
    at __webpack_require__ (bundle.js:622)
    at fn (bundle.js:48)
    at eval (client:1)
    at Object.<anonymous> (bundle.js:2541)
    at __webpack_require__ (bundle.js:622)
    at bundle.js:668
    at bundle.js:671

我的 webpack 是:

import webpack from 'webpack';
import merge from 'webpack-merge';
import path from 'path';
import isDev from 'isdev';
import  Dir  from './src/utils';

const TARGET = process.env.npm_lifecycle_event;

let Config = 
  entry: [
    'babel-polyfill',
    'react-hot-loader/patch',
    path.join(Dir.src, 'client.js'),
  ],
  output: 
    path: path.join(Dir.public, 'build'),
    filename: 'bundle.js',
  ,
  target: 'node',
  resolve: 
    modules: [Dir.src, 'node_modules'],
    extensions: ['*', '.js', '.jsx', '.json'],
  ,
  module: 
    rules: [
      
        test: /\.js?$/,
        enforce: 'pre',
        loader: 'eslint-loader',
        exclude: /node_modules/,
        include: Dir.src,
      ,
      
        test: /\.js?$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
      ,
    ],
  ,
  plugins: [
    new webpack.optimize.OccurrenceOrderPlugin(),
    new webpack.DefinePlugin(
      'process.env': 
        NODE_ENV: JSON.stringify(process.env.NODE_ENV),
      ,
    ),
  ],
;

if (TARGET === 'build:prod' && !isDev) 
  Config = merge(Config, 
    bail: true,
    devtool: 'source-map',
    output:  publicPath: '/build/' ,
    plugins: [
      new webpack.optimize.DedupePlugin(),
      new webpack.optimize.UglifyJsPlugin(
        comments: false,
        dropDebugger: true,
        dropConsole: true,
        compressor: 
          warnings: false,
        ,
      ),
    ],
  );


if (TARGET === 'server:dev' && isDev) 
  Config = merge(Config, 
    devtool: 'eval',
    entry: ['webpack-hot-middleware/client'],
    plugins: [
      new webpack.HotModuleReplacementPlugin(),
      new webpack.NoEmitOnErrorsPlugin(),
    ],
  );


const WebpackConfig = Config;
export default WebpackConfig;

这个错误只有在我添加了 Redux 建议的服务器端渲染后才开始出现。所以我在 ./src/utils/store.js 中使用 window.__PRELOADED_STATE__ 对商店进行水合,它也在 index.ejs 中,这是呈现给客户。

这就是它在我的 store.js 中的样子:

import thunk from 'redux-thunk';
import logger from 'redux-logger';
import  createStore, applyMiddleware, compose  from 'redux';
import reducers from '../reducers';

export function configureStore(preloadedState) 
    let state;
    const middleware = [thunk, logger];
    const enhancer = compose(applyMiddleware(...middleware));

    if (typeof preloadedState === 'undefined') state = ;
    else state = preloadedState;

    return createStore(reducers, state, enhancer);


/**
 Dehydrate (on server)
*/
export function dehydrate(store) 
    return JSON.stringify(store.getState()).replace(/</g, '\\u003c');


/**
  Rehydrate (on client)
*/
export function rehydrate() 
    // Grab the state from a global variable injected into the server-generated html
    const preloadedState = window.__PRELOADED_STATE__;
    // // Allow the passed state to be garbage-collected
    delete window.__PRELOADED_STATE__;

    return configureStore(preloadedState);

如果有的话,这也是我的 .babelrc:


    "presets": ["es2015", "react", "stage-0"],
    "env": 
        "development": 
            "plugins": ["react-hot-loader/babel"],
        ,
    ,
    "plugins": [
        "babel-root-import"
    ],

希望任何人都可以提供帮助 - 我在研究和试验中还没有找到解决方案。谢谢!

【问题讨论】:

【参考方案1】:

我在一个非 React 项目中遇到了同样的错误消息。我正在构建一个捆绑包并使用 karma 在 Chrome 中运行它。解决方案是从

更改我的 webpack 配置
target: 'node'

target: 'web'

参考:https://webpack.js.org/configuration/target/

【讨论】:

以上是关于未捕获的 ReferenceError:全局未在 eval 中定义的主要内容,如果未能解决你的问题,请参考以下文章

未捕获的 ReferenceError:RegeneratorRuntime 未在 React 中定义

未捕获的 ReferenceError:(函数)未在 HTMLButtonElement.onclick 中定义

未捕获的 ReferenceError:jQuery 未在 eval 中定义

visual studio typescript“未捕获的ReferenceError:未在...定义导出” [重复]

未捕获的 ReferenceError:ace 未在 Angular 4 中定义

未捕获的 ReferenceError: 要求未在 app.js:3 中定义