Chromium and Dart: "An error occurred loading file" - apache

Question

I'm trying to run some Dart templates from Stagehand. The 'ubersimplewebapp' app works. There's almost nothing to it. I've tried a couple of others and they don't. I'm currently trying to get 'webapp' to work. In install using PHPStorm and there are no errors. When I run it in the Chromium browser, I get the following console errors:
GET http://dartorium.loc/packages/browser/dart.js
GET http://dartorium.loc/packages/dartorium/nav_menu.dart
An error occurred loading file: package:dartorium/nav_menu.dart
GET http://dartorium.loc/packages/route_hierarchical/client.dart
An error occurred loading file: package:route_hierarchical/client.dart
GET http://dartorium.loc/packages/dartorium/reverser.dart
An error occurred loading file: package:dartorium/reverser.dart
This is the pubspec.yaml file:
name: 'dartorium'
version: 0.0.1
description: >
A minimal web app for the developer that doesn’t want to be confused by too
much going on.
#author: <your name> <email#example.com>
#homepage: https://www.example.com
environment:
sdk: '>=1.0.0 <2.0.0'
dependencies:
browser: any
sass: '>=0.4.0 <0.5.0'
script_inliner: '>=1.0.0 <2.0.0'
route_hierarchical: '>=0.5.0 <0.7.0'
transformers:
- script_inliner
#- sass:
# style: compressed
This is the log from installing the template the PHPStorm produced:
Working dir: /Volumes/Data/htdocs/dartorium
/usr/local/opt/dart/libexec/bin/pub get
Resolving dependencies...
+ analyzer 0.22.4 (0.24.0 available)
+ args 0.12.2+6
+ barback 0.15.2+4
+ browser 0.10.0+2
+ cli_util 0.0.1+1
+ code_transformers 0.2.5
+ collection 1.1.0
+ csslib 0.11.0+4
+ html5lib 0.12.0
+ logging 0.9.3
+ path 1.3.3
+ pool 1.0.1
+ route_hierarchical 0.6.1+1
+ sass 0.4.2
+ script_inliner 1.0.0
+ source_maps 0.10.0+1
+ source_span 1.0.3
+ stack_trace 1.2.1
+ utf 0.9.0+2
+ watcher 0.9.4
+ when 0.2.0
+ which 0.1.3
Changed 22 dependencies!
Precompiling dependencies...
Loading source assets...
Loading script_inliner transformers...
Precompiled script_inliner.
Process finished with exit code 0
A directory snapshot
My vhosts entry just in case:
<VirtualHost *:80>
ServerName dartorium.loc
DocumentRoot "/Volumes/Data/htdocs/dartorium/web"
<directory /Volumes/Data/htdocs/dartorium>
Allow from all
Options -MultiViews
Require all granted
</directory>
</VirtualHost>
Update
I decided to try creating the app outside of PHPStorm. I deleted the app and did 'stagehand webapp' in Terminal to install it again and then 'pub get'. I still got the same errors.
I then noticed a comment in the output that said to do 'pub serve' and then connect to the site on localhost:8080. When I did that, the app ran fine. So now my question is how do you run the app using Apache?
Answer
The accepted answer below given by Günter Zöchbauer solved the problem. In addition to what is described there, I made two other changes. After any change in the code, I run 'pub build'. I'm spoiled by working in PHP and RoR using RubyMine where all I have to do is refresh the browser. The other change was to my vhosts entry. It's now set to:
<VirtualHost *:80>
ServerName dartorium.loc
DocumentRoot "/Volumes/Data/htdocs/dartorium/build/web"
</VirtualHost>
I had originally added the permissions to fix some access problems I had before starting this post. It turns out they weren't necessary. The entry now points to build/web instead of the web directory in which you work.

Answer 1

You need to run pub build to generate JavaScript output (in build/web). This build output can be served by apache.
The build output works fine in Chrome without change. To make it work in Dartium I changed the script tags:
<script src="main.dart.js"></script>
<!--<script type="application/dart" src="main.dart"></script> -->
<!--<script data-pub-inline src="packages/browser/dart.js"></script>-->