support config for baseUrl

[chaiwatmat]

Is it possible for set baseUrl example:

http://localhost:3000/dashboard

[pascalw]

Hi @chaiwatmat I think you might be able to achieve this as follows.

In your dashbling.config.js add a configureServer function that sets the server.realm.modifiers.route.prefix like so:

module.exports = {
  /* rest of config */
  configureServer: async server => {
    server.realm.modifiers.route.prefix = "dashboard";
  }
};

Note that I haven't been able to test this myself as I don't have access to a computer at the moment. Let me know if it works, if not I can look into it next week.

[chaiwatmat]

Thanks @pascalw for quick response.

I tried following by your suggestions but it not works

module.exports = {
  /* rest of config */
  configureServer: async server => {
    server.realm.modifiers.route.prefix = "/dashboard"; /* already tried with "dashboard", also not works too */

    server.route({
      method: "GET",
      path: "/ping",
      handler: (_request, _h) => "pong"
    });
  }
};

Results

• http://localhost:3000/dashboard/ping works
• http://localhost:3000/dashboard/ping/ not works
• http://localhost:3000/dashboard not works
• http://localhost:3000/dashboard/ not works
• http://localhost:3000 works
• http://localhost:3000/ works

Output logs

chaiwatmat-mbp:dashboard chaiwatmat$ npm run start

> [email protected] start /Users/chaiwatmat/projects/dashboard
> NODE_ENV=${NODE_ENV:-development} dashbling start

2019-10-28T19:07:13+0700 [warn] No authToken was specified, using random token 3XPi1TiOc358Ic0yVTz3lNWQ for authentication.
clean-webpack-plugin: /Users/chaiwatmat/projects/dashboard/dist has been removed.
2019-10-28T19:07:14+0700 [info] Server running at: http://chaiwatmat-mbp:3000

WARNING: We noticed you're using the `useBuiltIns` option without declaring a core-js version. Currently, we assume version 2.x when no version is passed. Since this default version will likely change in future versions of Babel, we recommend explicitly setting the core-js version you are using via the `corejs` option.

You should also be sure that the version you pass to the `corejs` option matches the version specified in your `package.json`'s `dependencies` section. If it doesn't, you need to run one of the following commands:

  npm install --save core-js@2    npm install --save core-js@3
  yarn add core-js@2              yarn add core-js@3

webpack built d8f6d4a8405ea01260f9 in 1899ms
ℹ ｢wdm｣: Hash: d8f6d4a8405ea01260f9
Version: webpack 4.41.0
Time: 1899ms
Built at: 10/28/2019 7:07:15 PM
                          Asset       Size  Chunks                         Chunk Names
    app.d8f6d4a8405ea01260f9.js   1.49 MiB     app  [emitted] [immutable]  app
app.d8f6d4a8405ea01260f9.js.map   1.61 MiB     app  [emitted] [dev]        app
                     index.html  359 bytes          [emitted]              
Entrypoint app = app.d8f6d4a8405ea01260f9.js app.d8f6d4a8405ea01260f9.js.map
[0] multi ./index.js webpack-hot-middleware/client 40 bytes {app} [built]
[./Dashboard.js] 3.94 KiB {app} [built]
[./index.js] 218 bytes {app} [built]
[./node_modules/@dashbling/client/components/index.js] 71 bytes {app} [built]
[./node_modules/@dashbling/client/dashbling.js] 2.36 KiB {app} [built]
[./node_modules/@dashbling/client/index.js] 527 bytes {app} [built]
[./node_modules/@dashbling/client/store.js] 1.39 KiB {app} [built]
[./node_modules/ansi-html/index.js] 4.16 KiB {app} [built]
[./node_modules/ansi-regex/index.js] 135 bytes {app} [built]
[./node_modules/strip-ansi/index.js] 161 bytes {app} [built]
[./node_modules/webpack-hot-middleware/client-overlay.js] (webpack)-hot-middleware/client-overlay.js 2.17 KiB {app} [built]
[./node_modules/webpack-hot-middleware/client.js] (webpack)-hot-middleware/client.js 7.68 KiB {app} [built]
[./node_modules/webpack-hot-middleware/process-update.js] (webpack)-hot-middleware/process-update.js 4.35 KiB {app} [built]
[./node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 497 bytes {app} [built]
[./styles/main.scss] 1.3 KiB {app} [built]
    + 166 hidden modules
Child html-webpack-plugin for "index.html":
         Asset     Size  Chunks  Chunk Names
    index.html  534 KiB       0  
    Entrypoint undefined = index.html
    [./node_modules/html-webpack-plugin/lib/loader.js!./index.html] 490 bytes {0} [built]
    [./node_modules/lodash/lodash.js] 528 KiB {0} [built]
    [./node_modules/webpack/buildin/global.js] (webpack)/buildin/global.js 472 bytes {0} [built]
    [./node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 497 bytes {0} [built]
ℹ ｢wdm｣: Compiled successfully.
2019-10-28T19:08:15+0700 [info] 127.0.0.1: GET /dashboard/ping 200
2019-10-28T19:08:20+0700 [info] 127.0.0.1: GET /dashboard/ping/ 404
2019-10-28T19:08:24+0700 [info] 127.0.0.1: GET /dashboard 404
2019-10-28T19:08:27+0700 [info] 127.0.0.1: GET /dashboard/ 404
2019-10-28T19:08:41+0700 [info] 127.0.0.1: GET /events 200

[pascalw]

Thanks @chaiwatmat for the detailed information. I'll try to look into this later this week.

[pascalw]

Hi @chaiwatmat I looked into this and to implement the following changes would be required:

• A baseUrl property needs to be added to the Dashbling config.
• This baseUrl needs to be configured in two places:
  • The Hapi server, via server.realm.modifiers.route.prefix but it should be done before any other routes are loaded otherwise these routes will still be relative to the original root.
  • The Webpack dev middleware, so assets in dev are also served from the baseUrl.

Would you be willing and able to create a PR to do this? I have limited time currently, so it could take a while before I get to this.

[chaiwatmat]

@pascalw I'll look into it.