Valip
Valip

Reputation: 4620

nodejs start react-app client

I've made a web app using create-react-app which works fine, and I usually run it using npm start but now I have to deploy it and make it work with nodejs forever module.

If I do node src/index.js it will give a syntax error and to fix this I used babel to transpile es6 to es5, but again I get the following syntax error when importing the css file:

/client/src/stylesheets/menu.css:1
(function (exports, require, module, __filename, __dirname) { header {
                                                                     ^

SyntaxError: Unexpected token {

This is my package.json file:

{
  "dependencies": {
    "async": "^2.5.0",
    "axios": "^0.16.2",
    "classnames": "^2.2.5",
    "date-diff": "^0.1.3",
    "jwt-decode": "^2.2.0",
    "lodash": "^4.17.4",
    "react": "^15.6.1",
    "react-bootstrap": "^0.31.2",
    "react-bootstrap-table": "^4.0.2",
    "react-dom": "^15.6.1",
    "react-redux": "^5.0.6",
    "react-router": "^4.2.0",
    "react-router-dom": "^4.2.2",
    "react-scripts": "1.0.12",
    "react-select": "^1.0.0-rc.5",
    "redux": "^3.7.2",
    "redux-thunk": "^2.2.0",
    "shortid": "^2.2.8",
    "validator": "^8.1.0"
  },
  "scripts": {
    "start": "react-scripts-with-stylus start src/stylesheets/menu.styl",
    "build": "react-scripts-with-stylus build src/stylesheets/menu.styl",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "proxy": "http://localhost:8081",
  "devDependencies": {
    "babel": "^6.23.0",
    "babel-cli": "^6.24.1",
    "babel-core": "^6.25.0",
    "babel-polyfill": "^6.23.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "create-react-app-stylus": "^1.1.1",
    "webpack": "^3.5.5"
  }
}

Upvotes: 0

Views: 129

Answers (1)

Shota
Shota

Reputation: 7330

To sum up the answer to this question:

  • If you need to deploy it, you should make a build, not run your application directly.
  • run npm run build and it will generate build files into a new folder.
  • You should not try to run the application with npm at all. You should copy all the files from the build folder into the root of your server and when a user opens the page it will be shown index.html file.
  • If your code has changed and is ready for production you can rebuild it, or you can automate this process with some CI tool.
  • You should only have React client files on your Git repository, build files should be generated during the build process on your server.

Upvotes: 1

Related Questions