How to serve a polymer application from dart shelf static file handler?

1
votes

I'm trying to serve a polymer application using a shelf static server. I create next structure:


    polymerapp
      - pubspec.yml
      - bin
          - server.dart
      - web
          - index.html
      - lib
          - main_app.dart
          - main_app.html

Inside server.dart I put this code:

import 'dart:io' show Platform;
import 'dart:async' show runZoned;
import 'package:path/path.dart' show join, dirname;
import 'package:shelf/shelf_io.dart' as io;
import 'package:shelf_static/shelf_static.dart';

void main() {
  // Assumes the server lives in bin/ and that `pub build` ran
  var pathToBuild = join(dirname(Platform.script.toFilePath()),
      '..', 'web');

  var handler = createStaticHandler(pathToBuild,
      defaultDocument: 'index.html');

  var portEnv = Platform.environment['PORT'];
  var port = portEnv == null ? 9999 : int.parse(portEnv);

  runZoned(() {
    io.serve(handler, '0.0.0.0', port);
    print("Serving $pathToBuild on port $port");
  },
  onError: (e, stackTrace) => print('Oh noes! $e $stackTrace'));
}

the rest is the template polymer application created by dart editor.

The problem is that when I try to access localhost:9999 from the browser it shows me the next errors:


    Failed to load resource: the server responded with a status of 404 (Not Found)
      http://localhost:9999/packages/paper_elements/roboto.html
    Failed to load resource: the server responded with a status of 404 (Not Found)
      http://localhost:9999/packages/polymertest/main_app.html
    Failed to load resource: the server responded with a status of 404 (Not Found)
      http://localhost:9999/packages/polymer/init.dart
    An error occurred loading file: package:polymer/init.dart

I want to do this for a faster way of development. In that case I don't need to build the polymer-dart application every time that I made a change.

2
dartdart-polymerdart-shelf

2 Answers

2
votes

You can pass serveFilesOutsidePath: true to createStaticHandler()

 var handler = createStaticHandler(pathToBuild,
   defaultDocument: 'index.html',
   serveFilesOutsidePath: true);

Also, during development you can use pub serve with shelf_proxy for incremental build. See here for an example.

0
votes

The combination of shelf_proxy in dev shelf_static in prod is very useful. The clever dart team came up with the idea of combining those and I borrowed the idea in mojito. You can use it as follows

import 'package:mojito/mojito.dart';

final app = mojito.init();

app.router..addStaticAssetHandler('/ui');

The code for that is here which you can copy if you prefer