search

cloverfield-tools / universal-react-boilerplate

A simple boilerplate Node app.
MIT License
904 stars 97 forks source link

Fixes a getting started issue #71

Closed tullo closed 8 years ago

tullo commented 8 years ago

The README should probably also mention what route to take (/test-data) so noobs like me don't look like a big ? when nothing happens under /

tullo commented 8 years ago

The static/index.js gives the 404

   <!doctype html>
    <html>
      <head>
        <title>Your Cool React App!</title>
      </head>
      <body>
        <div id='root'><div data-reactid=".2gjcdesgb28" data-react-checksum="-51373845"><h1 data-reactid=".2gjcdesgb28.0"></h1></div></div>
        <script>
          window.BOOTSTRAP_CLIENT_STATE = {"books":{"items":[{"id":1,"text":"Book 1","count":2},{"id":2,"text":"Book 2","count":3},{"id":3,"text":"Book 3","count":4}]},"routing":{}}
        </script>
        <script src="/static/index.js"></script>
      </body>
    </html>
tullo commented 8 years ago

Steps to reproduce:

  1. cd /tmp
  2. git clone git clone https://github.com/cloverfield-tools/universal-react-boilerplate.git
  3. cd universal-react-boilerplate/
  4. npm i
  5. npm start
  6. firefox http://0.0.0.0:3000 or firefox http://0.0.0.0:3000/test-data
  7. view-source:http://0.0.0.0:3000/test-data
  8. follow the link to the script /static/index.js
  9. the request above returns a 404 as the requested file should come from the build dir that does not exist yet
tree -L 1
├── app-home.js
├── circle.yml
├── devServer.js
├── LICENSE
├── node_modules
├── package.json
├── README.md
├── source
├── static
├── webpack.config.dev.js
└── webpack.config.prod.js

But the server side references (server/app.js) the ./build directory to serve '/static/index.js'

const buildDir = '/build';
const staticDir = path.join(settings.APP_HOME, buildDir);
app.use('/static', express.static(staticDir));