isomorphic-webpack icon indicating copy to clipboard operation
isomorphic-webpack copied to clipboard

Unable to run demo on macOS 10.12 / Node 7.1

Open rhysforyou opened this issue 8 years ago • 4 comments

I'm trying to run gajus/isomorphic-webpack-demo on my machine without much luck. Following the exact instructions provided in the README, I see the following output:

$ npm start

> @ start /Users/rpowell/Code/isomorphic-webpack-demo
> babel-node ./src/bin/server.js

keywords if/then/else require v5 option
  express:application set "x-powered-by" to true +0ms
  express:application set "etag" to 'weak' +2ms
  express:application set "etag fn" to [Function: wetag] +1ms
  express:application set "env" to 'development' +0ms
  express:application set "query parser" to 'extended' +0ms
  express:application set "query parser fn" to [Function: parseExtendedQueryString] +0ms
  express:application set "subdomain offset" to 2 +0ms
  express:application set "trust proxy" to false +1ms
  express:application set "trust proxy fn" to [Function: trustNone] +0ms
  express:application booting in development mode +0ms
  express:application set "view" to [Function: View] +0ms
  express:application set "views" to '/Users/rpowell/Code/isomorphic-webpack-demo/views' +0ms
  express:application set "jsonp callback name" to 'callback' +0ms
  isomorphic-webpack manifestPath /Users/rpowell/Code/isomorphic-webpack-demo/src/manifest.json +26ms
  isomorphic-webpack compiler event: compile (compilationPromiseIsResolved: true) +0ms
  isomorphic-webpack compiler event: done +802ms
  isomorphic-webpack manifest { content: 
   { './app/index.js': { id: 0, meta: {} },
     '../node_modules/css-loader/index.js?{"importLoaders":1,"localIdentName":"[path]___[name]___[local]","modules":1}!../node_modules/resolve-url-loader/index.js!./app/style.css': { id: 1, meta: {} },
     '../node_modules/css-loader/lib/css-base.js': { id: 2, meta: {} },
     '../node_modules/style-loader/addStyles.js': { id: 3, meta: {} },
     './app/style.css': { id: 4, meta: {} } } } +0ms
  isomorphic-webpack requestMap { './app/index.js': 0,
  '../node_modules/css-loader/index.js?{"importLoaders":1,"localIdentName":"[path]___[name]___[local]","modules":1}!../node_modules/resolve-url-loader/index.js!./app/style.css': 1,
  '../node_modules/css-loader/lib/css-base.js': 2,
  '../node_modules/style-loader/addStyles.js': 3,
  './app/style.css': 4 } +2ms
  isomorphic-webpack bundleName app +0ms

webpack: Compiled successfully.
  isomorphic-webpack entryScriptPath /Users/rpowell/Code/isomorphic-webpack-demo/src/app +9s
  isomorphic-webpack evaluating module ID %i 0 +0ms
ReferenceError: self is not defined
    at isomorphic-webpack:195:30
    at isomorphic-webpack:190:47
    at module.exports (isomorphic-webpack:212:68)
    at Object.<anonymous> (isomorphic-webpack:440:36)
    at __webpack_require__ (isomorphic-webpack:20:30)
    at Object.<anonymous> (isomorphic-webpack:88:14)
    at __webpack_require__ (isomorphic-webpack:20:30)
    at evalBundleCode (/Users/rpowell/Code/isomorphic-webpack-demo/node_modules/isomorphic-webpack/dist/factories/createIsomorphicWebpack.js:141:12)
    at /Users/rpowell/Code/isomorphic-webpack-demo/src/bin/server.js:62:30
    at Layer.handle [as handle_request] (/Users/rpowell/Code/isomorphic-webpack-demo/node_modules/router/lib/layer.js:93:5)

Some details about my system:

  • OS: macOS 10.12.3
  • Node Version: v7.7.1
  • NPM Version: 4.1.2

Also for what it's worth, I tried this on multiple computers and saw the exact same issue.

rhysforyou avatar Mar 05 '17 11:03 rhysforyou

Getting the same ReferenceError: self is not defined error as described above. It works working fine until a fresh npm install.

gz2432 avatar Mar 05 '17 20:03 gz2432

+1 for me. I am suspecting this is due to WebPack 2.x related changes. Exploring now.

  • OS: macOS 10.12.2
  • Node Version: v7.7.7
  • NPM Version: 4.3

lorenjohnson avatar Mar 08 '17 23:03 lorenjohnson

Tried futzing with downgrading versions of things but unfortunately didn't get anywhere.

lorenjohnson avatar Mar 09 '17 02:03 lorenjohnson

Hey just an update on this, I've been rolling my own isomorphic webpack solution for learning purposes, and two things solved this issue for me.

  1. Adding the following to my serverside webpack config

    target: 'node',
    node: {
      console: false,
      global: false,
      process: false,
      Buffer: false,
      __filename: false,
      __dirname: false,
      setImmediate: false
    },
    
  2. Using node-style-loader on the server, as regular old style-loader doesn't work on the server.

I'm sure these exact solutions won't work for isomorphic-webpack, but they're a good place to start

rhysforyou avatar Mar 19 '17 01:03 rhysforyou