鍍金池/ 問(wèn)答/HTML5  Linux  HTML/ react.js react-router關(guān)于服務(wù)器部署問(wèn)題?

react.js react-router關(guān)于服務(wù)器部署問(wèn)題?

我在本地把項(xiàng)目build之后,怎么樣在服務(wù)器上部署?我現(xiàn)在把build文件夾拖到服務(wù)器上之后,如果用serve -s 會(huì)報(bào)

const { coroutine } = require('bluebird')
      ^

SyntaxError: Unexpected token {
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:374:25)
    at Object.Module._extensions..js (module.js:417:10)
    at Module.load (module.js:344:32)
    at Function.Module._load (module.js:301:12)
    at Function.Module.runMain (module.js:442:10)
    at startup (node.js:136:18)
    at node.js:966:3
    

請(qǐng)問(wèn)這個(gè)錯(cuò)誤是什么意思?應(yīng)該怎么部署?

回答
編輯回答
陌上花

const coroutine = require('bluebird').coroutine

2017年8月21日 03:40
編輯回答
鹿惑

require('bluebird').coroutine 百度查一下信息

2018年6月26日 20:25
編輯回答
扯不斷
var Promise = require("bluebird");
Promise.coroutine(function* (val) {
    ...
    ...
});

部署問(wèn)題:
單頁(yè)面應(yīng)用應(yīng)該放到nginx或者apache、tomcat等web代理服務(wù)器中,同時(shí)要根據(jù) 自己服務(wù)器的項(xiàng)目路徑 更改react的路由地址。
如果說(shuō)項(xiàng)目是直接跟在域名后面的,比如:http://www.sosout.com ,根路由就是 '/'。
如果說(shuō)項(xiàng)目是直接跟在域名后面的一個(gè)子目錄中的,比如:http://www.sosout.com/children ,根路由就是 '/children ',不能直接訪問(wèn)index.html。

以配置Nginx為例,配置過(guò)程大致如下:
(假設(shè):
1、項(xiàng)目文件目錄: /mnt/html/reactAntd(reactAntd目錄下的文件就是執(zhí)行了npm run dist 后生成的antd目錄下的文件)
2、訪問(wèn)域名:antd.sosout.com
進(jìn)入nginx.conf新增如下配置:

server {
    listen 80;
    server_name  antd.sosout.com;
    root /mnt/html/reactAntd;
    index index.html;
    location ~ ^/favicon\.ico$ {
        root /mnt/html/reactAntd;
    }

    location / {
        try_files $uri $uri/ /index.html;
        proxy_set_header   Host             $host;
        proxy_set_header   X-Real-IP        $remote_addr;
        proxy_set_header   X-Forwarded-For  $proxy_add_x_forwarded_for;
        proxy_set_header   X-Forwarded-Proto  $scheme;
    }
    access_log  /mnt/logs/nginx/access.log  main;
}

注意事項(xiàng):
1、配置域名的話,需要80端口,成功后,只要訪問(wèn)域名即可訪問(wèn)的項(xiàng)目
2、如果你使用了react-router的browserHistory 模式,在nginx配置還需要重寫路由:

server {
    listen 80;
    server_name  antd.sosout.com;
    root /mnt/html/reactAntd;
    index index.html;
    location ~ ^/favicon\.ico$ {
        root /mnt/html/reactAntd;
    }

    location / {
        try_files $uri $uri/ @fallback;
        index index.html;
        proxy_set_header   Host             $host;
        proxy_set_header   X-Real-IP        $remote_addr;
        proxy_set_header   X-Forwarded-For  $proxy_add_x_forwarded_for;
        proxy_set_header   X-Forwarded-Proto  $scheme;
    }
    location @fallback {
        rewrite ^.*$ /index.html break;
    }
    access_log  /mnt/logs/nginx/access.log  main;
}

為什么要重寫路由?因?yàn)槲覀兊捻?xiàng)目只有一個(gè)根入口,當(dāng)輸入類似/home的url時(shí),如果找不到對(duì)應(yīng)的頁(yè)面,nginx會(huì)嘗試加載index.html,這是通過(guò)react-router就能正確的匹配我們輸入的/home路由,從而顯示正確的home頁(yè)面,如果browserHistory模式的項(xiàng)目沒(méi)有配置上述內(nèi)容,會(huì)出現(xiàn)404的情況。

2017年11月25日 08:59