mirror of
https://github.com/kevin-DL/sapper.git
synced 2026-01-13 19:45:26 +00:00
Compare commits
612 Commits
v0.7.3
...
v0.26.0-al
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
7150c7e088 | ||
|
|
a85e1424e3 | ||
|
|
0628ea99ab | ||
|
|
3d7cfbbf3d | ||
|
|
66be631572 | ||
|
|
c964500118 | ||
|
|
91ea0335ae | ||
|
|
11d3da3aed | ||
|
|
7fefc59929 | ||
|
|
3521eff4f4 | ||
|
|
b7fce99438 | ||
|
|
85c86b5562 | ||
|
|
81bbfce448 | ||
|
|
6e8ba295d4 | ||
|
|
0168d8b70c | ||
|
|
548de702ac | ||
|
|
7ba1a0a9fa | ||
|
|
3bab780f88 | ||
|
|
263bb08334 | ||
|
|
3445ec66ac | ||
|
|
4940c5d5be | ||
|
|
83c8d7f855 | ||
|
|
fdfe282130 | ||
|
|
b5fbc7e0e8 | ||
|
|
64eb3f856a | ||
|
|
18d8e61ecb | ||
|
|
2a635f92a9 | ||
|
|
44bcbeb7d6 | ||
|
|
4023831b18 | ||
|
|
969169ae20 | ||
|
|
79fa15da3d | ||
|
|
ddc08d94cc | ||
|
|
f587161d7d | ||
|
|
d486542a8b | ||
|
|
c990c771d8 | ||
|
|
90f3393ebf | ||
|
|
76ce7f227f | ||
|
|
1f9efd353c | ||
|
|
3499631e8e | ||
|
|
2a825269e9 | ||
|
|
83f7102f6b | ||
|
|
e4319bee0e | ||
|
|
da540ef15f | ||
|
|
c00af6dad0 | ||
|
|
92206742d4 | ||
|
|
14fc6b3176 | ||
|
|
e2193a6080 | ||
|
|
f66c7dcb0d | ||
|
|
06f1a0e6c0 | ||
|
|
7726325b4b | ||
|
|
b6bc90cea9 | ||
|
|
cfba9b2168 | ||
|
|
b25c642bf1 | ||
|
|
82a023c302 | ||
|
|
f97400caaa | ||
|
|
03af9b1a16 | ||
|
|
02cef046aa | ||
|
|
c2aeac34b6 | ||
|
|
abd2f7fd39 | ||
|
|
e7cf9bf1b6 | ||
|
|
1fdd0e3ad2 | ||
|
|
af0a7e04f9 | ||
|
|
ed19a19fed | ||
|
|
8ebfcc9a54 | ||
|
|
af2a792508 | ||
|
|
14e809af6e | ||
|
|
03c5f5b446 | ||
|
|
6655b1b49d | ||
|
|
eebf076f23 | ||
|
|
198be28f4b | ||
|
|
4f720446b2 | ||
|
|
e69cb3639a | ||
|
|
1b1a86764f | ||
|
|
f50f83c4a4 | ||
|
|
eadefd996b | ||
|
|
ab52aabd1d | ||
|
|
c5a80543b3 | ||
|
|
cfd95ac024 | ||
|
|
73ff95c677 | ||
|
|
382fe6b7b9 | ||
|
|
3b714c0de3 | ||
|
|
28186227a9 | ||
|
|
2ac0f2bf3d | ||
|
|
4991f3b359 | ||
|
|
65128118c7 | ||
|
|
3eced6fa4d | ||
|
|
c4aee66c32 | ||
|
|
410c52df41 | ||
|
|
ffd56e2a20 | ||
|
|
1e5a87cf71 | ||
|
|
281e183c61 | ||
|
|
3fe7b55955 | ||
|
|
464924ed67 | ||
|
|
8108642845 | ||
|
|
e5d7d8ab2b | ||
|
|
d3e560325d | ||
|
|
64e5065aa5 | ||
|
|
cb45bb0fbe | ||
|
|
f39455014a | ||
|
|
4fe8df3696 | ||
|
|
4fdc7055c1 | ||
|
|
cca417a85a | ||
|
|
635c13a175 | ||
|
|
2e3aef8b21 | ||
|
|
44736754ad | ||
|
|
a399d87d9b | ||
|
|
a68c62ce91 | ||
|
|
1b9b559d82 | ||
|
|
abcac75826 | ||
|
|
4118c566d1 | ||
|
|
0b76f12394 | ||
|
|
e51cb85c7c | ||
|
|
6ae9a5e7c5 | ||
|
|
52f40f9e63 | ||
|
|
5e59855a15 | ||
|
|
18acef3190 | ||
|
|
d7f6ca8b4d | ||
|
|
00321932ef | ||
|
|
7eb1ec727c | ||
|
|
3f586e19a1 | ||
|
|
05b702938f | ||
|
|
3026e7c36e | ||
|
|
27a5aed83e | ||
|
|
bb04af41bd | ||
|
|
9403799393 | ||
|
|
472c0c198a | ||
|
|
02256ae214 | ||
|
|
e2d325ec9f | ||
|
|
954bcba333 | ||
|
|
709c9992e3 | ||
|
|
9773781262 | ||
|
|
48b1fafc33 | ||
|
|
d1624add66 | ||
|
|
e2206d0e0d | ||
|
|
9cd4da4c39 | ||
|
|
6ded1a5975 | ||
|
|
584ddd1c85 | ||
|
|
4071acf7c0 | ||
|
|
e8773d3196 | ||
|
|
01a519a4d9 | ||
|
|
d9ad1d1b10 | ||
|
|
0826a58995 | ||
|
|
6a74097b0c | ||
|
|
278be67228 | ||
|
|
64921dfc3c | ||
|
|
c8962ccf8c | ||
|
|
664c093391 | ||
|
|
4375feac83 | ||
|
|
4d7d448597 | ||
|
|
2e2b8dcd83 | ||
|
|
b915bab070 | ||
|
|
8530d06d00 | ||
|
|
a43764a971 | ||
|
|
4f6efbda79 | ||
|
|
5573258a10 | ||
|
|
2185f89669 | ||
|
|
e30842caa8 | ||
|
|
ff24877d8f | ||
|
|
9cf90ce01d | ||
|
|
e7f9ddae86 | ||
|
|
ffa1e1f704 | ||
|
|
80bb958b47 | ||
|
|
532f559fc5 | ||
|
|
0bd1b0b8e2 | ||
|
|
10c5ff4169 | ||
|
|
273823dfd7 | ||
|
|
8f064fe5ac | ||
|
|
f29e7efbd6 | ||
|
|
e66e3cd7eb | ||
|
|
ff415b391b | ||
|
|
91182ad0a2 | ||
|
|
467041a3cd | ||
|
|
520949c5e1 | ||
|
|
8c07d9d2ac | ||
|
|
7bd684a80e | ||
|
|
cbb5e8755b | ||
|
|
7ef72dbb77 | ||
|
|
87ff9c2aeb | ||
|
|
2d1f535314 | ||
|
|
cd1b53b80d | ||
|
|
0a7be736c0 | ||
|
|
5ee53a98c6 | ||
|
|
0e8ed6612c | ||
|
|
5ec748b95d | ||
|
|
64b16715cd | ||
|
|
9ea5e5e251 | ||
|
|
68b78f56d6 | ||
|
|
68e93a8fa0 | ||
|
|
e377515867 | ||
|
|
99ae39b8a8 | ||
|
|
1b489f4687 | ||
|
|
91f2c6e49c | ||
|
|
f5e07e9f78 | ||
|
|
17297a9794 | ||
|
|
9ef4f33e38 | ||
|
|
30966ee7f2 | ||
|
|
ae90f774e1 | ||
|
|
0706b5f50a | ||
|
|
499b377bfd | ||
|
|
1baeb79d4b | ||
|
|
0cc5ff95d6 | ||
|
|
e90525c1e8 | ||
|
|
6ccae0cd33 | ||
|
|
8b60d568dc | ||
|
|
64c2394c9d | ||
|
|
b28037291a | ||
|
|
bf9cbe2f3b | ||
|
|
2c507b5a2e | ||
|
|
4a92fbbbfa | ||
|
|
b16440ff0f | ||
|
|
64223b572b | ||
|
|
1b6dfd3580 | ||
|
|
c0b833862a | ||
|
|
45f4c47a3e | ||
|
|
48b87edb5b | ||
|
|
f9f283603e | ||
|
|
a56ee6bdb7 | ||
|
|
a18af2a473 | ||
|
|
fe5a8fb1e7 | ||
|
|
57a26e3511 | ||
|
|
bebb0dd595 | ||
|
|
afba0491ed | ||
|
|
350d37e210 | ||
|
|
96fc19e939 | ||
|
|
5be3809d9e | ||
|
|
15cc4bf296 | ||
|
|
c7cce985e3 | ||
|
|
e00b315dec | ||
|
|
afcd643035 | ||
|
|
7cc2a03aae | ||
|
|
002718b609 | ||
|
|
45d216c64d | ||
|
|
3d69d483d7 | ||
|
|
54da524467 | ||
|
|
ee95240ca6 | ||
|
|
74d5d1f9c0 | ||
|
|
8c2688b1be | ||
|
|
e170e4af9b | ||
|
|
bc31c73c33 | ||
|
|
7798f8f684 | ||
|
|
70fd7038b0 | ||
|
|
c6af2ddfa3 | ||
|
|
65d0172abe | ||
|
|
1e22031765 | ||
|
|
46bf8f2b78 | ||
|
|
553db81b7b | ||
|
|
67cc29ed38 | ||
|
|
36f930f489 | ||
|
|
3b098caa6e | ||
|
|
d63b9437b5 | ||
|
|
e51c733e3f | ||
|
|
708fe4c74b | ||
|
|
4259fc8e58 | ||
|
|
f05a8e52a0 | ||
|
|
76cb6d97f3 | ||
|
|
5d0b7af47b | ||
|
|
bb737eeb32 | ||
|
|
86dee17040 | ||
|
|
01a709e017 | ||
|
|
f87f0e3b80 | ||
|
|
8226e9bc1f | ||
|
|
d6d0a15015 | ||
|
|
ddec58ebd4 | ||
|
|
9d904b3911 | ||
|
|
c36df0d650 | ||
|
|
ae19288797 | ||
|
|
de308d5bb0 | ||
|
|
99b096a5c4 | ||
|
|
36fc8a947b | ||
|
|
6393a30b13 | ||
|
|
458be49b35 | ||
|
|
f8d742bdd0 | ||
|
|
7e698f1613 | ||
|
|
70b5cc86dc | ||
|
|
19a5dcad1d | ||
|
|
85e25d6380 | ||
|
|
6e2383b66b | ||
|
|
200c5fcbd2 | ||
|
|
9cbb8bdc33 | ||
|
|
3d39836cfb | ||
|
|
24f2855f89 | ||
|
|
d5bf206d2a | ||
|
|
8abc01551e | ||
|
|
62b8a79e9f | ||
|
|
7f255563a4 | ||
|
|
32f4a50f25 | ||
|
|
18e6f29de7 | ||
|
|
b1a9be2dc3 | ||
|
|
c5456d3033 | ||
|
|
9b33dad589 | ||
|
|
4315a46ff2 | ||
|
|
0fb5827968 | ||
|
|
f9bf23dc43 | ||
|
|
611017fd28 | ||
|
|
72b265a35f | ||
|
|
e0d533f2ea | ||
|
|
dba83641e4 | ||
|
|
d0c6b9cdca | ||
|
|
14e5c8e761 | ||
|
|
cbbf4a95db | ||
|
|
55b7ffd2ed | ||
|
|
9f4d4e70de | ||
|
|
deef1bbfcf | ||
|
|
17b0fc0d0c | ||
|
|
3c44c511e4 | ||
|
|
7cf1b9613a | ||
|
|
99e5a9601c | ||
|
|
4c9c1dccf5 | ||
|
|
2cddd5afa0 | ||
|
|
8c6a0c4773 | ||
|
|
af5063552d | ||
|
|
419d154794 | ||
|
|
abda059be5 | ||
|
|
444908cac5 | ||
|
|
c6da26e1a0 | ||
|
|
aad87857ce | ||
|
|
666c113297 | ||
|
|
84a58f34a0 | ||
|
|
75f5b5c721 | ||
|
|
a176a3b79b | ||
|
|
1627a5767a | ||
|
|
6ff3a9e9ab | ||
|
|
3ce2bd30f9 | ||
|
|
de4f99807f | ||
|
|
eae8351f77 | ||
|
|
d386308301 | ||
|
|
13afbc84d7 | ||
|
|
31327b3780 | ||
|
|
81f483d7b8 | ||
|
|
1bcf20511b | ||
|
|
003fa8ab2c | ||
|
|
d1fcd07c92 | ||
|
|
47a6d6f662 | ||
|
|
4b2b6440d0 | ||
|
|
fc855f30f8 | ||
|
|
4a75fff4ec | ||
|
|
7b7b695938 | ||
|
|
2fca2e295f | ||
|
|
eae991d369 | ||
|
|
c2b393d3fd | ||
|
|
566addd406 | ||
|
|
3d77dacbd6 | ||
|
|
51b4f9cbbf | ||
|
|
1d611be83e | ||
|
|
1782904994 | ||
|
|
e3ddbfc181 | ||
|
|
8e3830b646 | ||
|
|
b28cdff233 | ||
|
|
7f586ff1a3 | ||
|
|
731d4f535c | ||
|
|
f8c731ca21 | ||
|
|
39eb3be01e | ||
|
|
d0bb728e25 | ||
|
|
58de0f9c99 | ||
|
|
b75ae7ba96 | ||
|
|
091e38082e | ||
|
|
74acf93c7a | ||
|
|
0e3775397f | ||
|
|
8dc52a04e4 | ||
|
|
008b607c01 | ||
|
|
d01a407137 | ||
|
|
c0c717d9ec | ||
|
|
4f011bfc37 | ||
|
|
6c4ab32cf0 | ||
|
|
09b4dc1b9a | ||
|
|
bdd5a54527 | ||
|
|
b7bb4db8c1 | ||
|
|
5b5f33d3cf | ||
|
|
9611656b76 | ||
|
|
e9a71774d5 | ||
|
|
2205b8aec5 | ||
|
|
5c4e4d5d36 | ||
|
|
e87247493f | ||
|
|
0aeb63a05b | ||
|
|
57eeb5659a | ||
|
|
f821c19528 | ||
|
|
b9a120164a | ||
|
|
087356f781 | ||
|
|
31110a5326 | ||
|
|
667a68768c | ||
|
|
5075981a90 | ||
|
|
611dc4f6be | ||
|
|
0b43eaa992 | ||
|
|
47cdc1c4c8 | ||
|
|
31c071ad72 | ||
|
|
e91edaee12 | ||
|
|
34c1fee5db | ||
|
|
5375422633 | ||
|
|
1dafe934b0 | ||
|
|
e1a33c6a9b | ||
|
|
0800fa016b | ||
|
|
8f3454c3b1 | ||
|
|
f0d7a1aaab | ||
|
|
8240595d70 | ||
|
|
658d8dd50c | ||
|
|
9eeeaa24c1 | ||
|
|
9c4a3592ff | ||
|
|
0e2c2ca101 | ||
|
|
8015be8069 | ||
|
|
e39ad59589 | ||
|
|
be7cff4818 | ||
|
|
d6632cf312 | ||
|
|
f6e012ec73 | ||
|
|
087acd5765 | ||
|
|
43bf6e8d8a | ||
|
|
78be6aa343 | ||
|
|
8ba57969c2 | ||
|
|
58d2f605fc | ||
|
|
e0b4319c7d | ||
|
|
98d0df4320 | ||
|
|
6aa3ce4f05 | ||
|
|
046db325f1 | ||
|
|
1a4bace5f4 | ||
|
|
0dbf75f100 | ||
|
|
4f49fd8d5c | ||
|
|
86f71e1faf | ||
|
|
147e2c64b5 | ||
|
|
9063057b0c | ||
|
|
25f0d94595 | ||
|
|
8155df2e22 | ||
|
|
bb51470004 | ||
|
|
53446e2ec7 | ||
|
|
c4c09550eb | ||
|
|
da47fdec96 | ||
|
|
971342ac7a | ||
|
|
3becc1cbe2 | ||
|
|
8ee5346900 | ||
|
|
9e4b79c6ff | ||
|
|
4ec1c65395 | ||
|
|
c743d11b3b | ||
|
|
b525eb6480 | ||
|
|
210d03fb06 | ||
|
|
0685cc4cbe | ||
|
|
9e2d0a7fbc | ||
|
|
a751a3b731 | ||
|
|
bc7faeeab9 | ||
|
|
a88c1de2f6 | ||
|
|
a231795c4c | ||
|
|
ba7525c676 | ||
|
|
4843e9a40a | ||
|
|
ca4a1ca9b0 | ||
|
|
ad7c872ee3 | ||
|
|
4f98324a8a | ||
|
|
1fcf3f79ee | ||
|
|
0b5741194a | ||
|
|
9653d4c6ce | ||
|
|
4fa5ed5e2c | ||
|
|
f4eac2515f | ||
|
|
1a5364ae9d | ||
|
|
d7a9074c69 | ||
|
|
00adb53802 | ||
|
|
b10edddc96 | ||
|
|
93b2d12438 | ||
|
|
7303e811be | ||
|
|
992d89027d | ||
|
|
3531cc587d | ||
|
|
562a91fa57 | ||
|
|
93128a0156 | ||
|
|
d7a2132966 | ||
|
|
56ac1aea9d | ||
|
|
37a9fb62e2 | ||
|
|
a70e88b1f4 | ||
|
|
6f9ce9ce85 | ||
|
|
917dd60cc3 | ||
|
|
b13cc6f39a | ||
|
|
2758382c68 | ||
|
|
dd7f1ff99c | ||
|
|
45142cd037 | ||
|
|
ceb1caf1de | ||
|
|
7e263a3076 | ||
|
|
ec88d4a430 | ||
|
|
909ea72108 | ||
|
|
cd09d75d99 | ||
|
|
0e3abe489a | ||
|
|
a5d141d2f1 | ||
|
|
87eae6164b | ||
|
|
97e00f5a9c | ||
|
|
bd55558b5e | ||
|
|
25dc4b3a4c | ||
|
|
72c27b78a3 | ||
|
|
25809ec409 | ||
|
|
3220c522d7 | ||
|
|
d5d25f1d30 | ||
|
|
7ccd6ba329 | ||
|
|
35c30ae2c5 | ||
|
|
2c61f6d396 | ||
|
|
86233a8eab | ||
|
|
c140b128ee | ||
|
|
a6b1527fd3 | ||
|
|
c2f3a2aac0 | ||
|
|
66ac9773c0 | ||
|
|
e60714bb98 | ||
|
|
52dfd6e939 | ||
|
|
fc2312eba6 | ||
|
|
cf90476255 | ||
|
|
1e8d7d10ab | ||
|
|
cf6621b83c | ||
|
|
9812cbd71c | ||
|
|
67a81a3cac | ||
|
|
67463683cc | ||
|
|
b94481b716 | ||
|
|
a95ddee48d | ||
|
|
953694f77f | ||
|
|
2f24cb0429 | ||
|
|
687071902d | ||
|
|
cd3fcfdf3c | ||
|
|
dad48e4abd | ||
|
|
37d3d57694 | ||
|
|
9a5d273590 | ||
|
|
3816fe71ad | ||
|
|
69f5b9cac7 | ||
|
|
ad14320dc3 | ||
|
|
43563bd8e5 | ||
|
|
02d558b97c | ||
|
|
866286c95e | ||
|
|
e1b5e336dc | ||
|
|
1d71b86c0f | ||
|
|
bdc248f09a | ||
|
|
be63ea7c96 | ||
|
|
819ec0b776 | ||
|
|
d22d37fb18 | ||
|
|
8ec433581a | ||
|
|
0d0e4d664e | ||
|
|
4348fad16d | ||
|
|
4314897a78 | ||
|
|
b1c57466c0 | ||
|
|
ef55fc5ddd | ||
|
|
e011fce935 | ||
|
|
ba3d9c85c5 | ||
|
|
cddd7adaad | ||
|
|
d8412f33ba | ||
|
|
254e41b11e | ||
|
|
491c5e3b92 | ||
|
|
4441ceb91d | ||
|
|
77e418cd21 | ||
|
|
4171786953 | ||
|
|
5f7cbadd8d | ||
|
|
9bac32eea4 | ||
|
|
3a19657ad9 | ||
|
|
d1b6d029e9 | ||
|
|
45b1147228 | ||
|
|
c827fda703 | ||
|
|
dd39909371 | ||
|
|
fb24c862f3 | ||
|
|
542115f82e | ||
|
|
61000a4795 | ||
|
|
7f98d50e15 | ||
|
|
c580259c07 | ||
|
|
e8f3aff0da | ||
|
|
c82031a8e5 | ||
|
|
1eed1023aa | ||
|
|
c1a2d93da6 | ||
|
|
504654b58e | ||
|
|
b1067103a4 | ||
|
|
06af8e87da | ||
|
|
8bb0999878 | ||
|
|
b5a8d29c37 | ||
|
|
5925636b16 | ||
|
|
bc232007c3 | ||
|
|
ffaacb4c99 | ||
|
|
47b50f2c0e | ||
|
|
a66ac00d42 | ||
|
|
0f8c04b03d | ||
|
|
d9d93f41c4 | ||
|
|
5289fc11d8 | ||
|
|
dd6c51567a | ||
|
|
01ff84f241 | ||
|
|
329c113723 | ||
|
|
2ad10b380f | ||
|
|
e6314cde96 | ||
|
|
b64e25a177 | ||
|
|
49bc1b00a9 | ||
|
|
24bfcc8d2d | ||
|
|
b405e5878e | ||
|
|
ef0ca58a21 | ||
|
|
854147fa6c | ||
|
|
50ecc5c130 | ||
|
|
7e2f5f8fb6 | ||
|
|
acef0e808f | ||
|
|
248573f510 | ||
|
|
e91955fdad | ||
|
|
368e6d5cb1 | ||
|
|
1984203e87 | ||
|
|
0165c14fd9 | ||
|
|
bdb9d49187 | ||
|
|
4d79cb81ed | ||
|
|
181b0711ec | ||
|
|
1b282e7b0d | ||
|
|
99853c5181 | ||
|
|
ff3b43443e | ||
|
|
2622692f69 | ||
|
|
7625302ec7 | ||
|
|
09422e3c5a | ||
|
|
a96fb93bfb | ||
|
|
17d7ca36f1 | ||
|
|
b73e5eaa8e | ||
|
|
d9cb572271 | ||
|
|
34c28f36cd | ||
|
|
5dd04eb35c | ||
|
|
b1d072d43a | ||
|
|
5ad3f3f1d5 | ||
|
|
58754c6d15 | ||
|
|
c36780fdc8 | ||
|
|
9bebb56bd6 | ||
|
|
f475634d8d | ||
|
|
58c1eb9fa8 | ||
|
|
631afbbfe4 | ||
|
|
1cc9acb4f1 | ||
|
|
19005110f1 | ||
|
|
21ee8ad39d | ||
|
|
906b0c7ad5 | ||
|
|
896fd410d1 |
20
.gitignore
vendored
20
.gitignore
vendored
@@ -1,16 +1,16 @@
|
||||
.DS_Store
|
||||
yarn.lock
|
||||
yarn-error.log
|
||||
node_modules
|
||||
cypress/screenshots
|
||||
test/app/.sapper
|
||||
test/app/app/manifest
|
||||
test/app/src/manifest
|
||||
__sapper__
|
||||
test/app/export
|
||||
test/app/build
|
||||
sapper
|
||||
runtime.js
|
||||
runtime.js.map
|
||||
cli.js
|
||||
cli.js.map
|
||||
middleware.js
|
||||
middleware.js.map
|
||||
core.js
|
||||
core.js.map
|
||||
webpack/config.js
|
||||
webpack/config.js.map
|
||||
dist
|
||||
!rollup.config.js
|
||||
/runtime/app.mjs
|
||||
/runtime/server.mjs
|
||||
@@ -18,5 +18,4 @@ addons:
|
||||
install:
|
||||
- export DISPLAY=':99.0'
|
||||
- Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 &
|
||||
- npm install
|
||||
- (cd test/app && npm install)
|
||||
- npm ci || npm i
|
||||
|
||||
437
CHANGELOG.md
437
CHANGELOG.md
@@ -1,5 +1,442 @@
|
||||
# sapper changelog
|
||||
|
||||
## 0.25.0
|
||||
|
||||
* Force refresh on `goto(current_url)` ([#484](https://github.com/sveltejs/sapper/pull/484))
|
||||
* Fix preloading navigation bug ([#532](https://github.com/sveltejs/sapper/issues/532))
|
||||
* Don't mutate opts.headers ([#528](https://github.com/sveltejs/sapper/issues/528))
|
||||
* Don't crawl hundreds of pages simultaneously ([#369](https://github.com/sveltejs/sapper/pull/369))
|
||||
|
||||
## 0.24.3
|
||||
|
||||
* Add service-worker-index.html shell file for offline support ([#422](https://github.com/sveltejs/sapper/issues/422))
|
||||
* Don't cache .map files ([#534](https://github.com/sveltejs/sapper/issues/534))
|
||||
|
||||
## 0.24.2
|
||||
|
||||
* Support Rollup 1.0 ([#541](https://github.com/sveltejs/sapper/pull/541))
|
||||
|
||||
## 0.24.1
|
||||
|
||||
* Include CSS chunks in webpack build info to avoid duplication ([#529](https://github.com/sveltejs/sapper/pull/529))
|
||||
* Fix preload `as` for styles ([#530](https://github.com/sveltejs/sapper/pull/530))
|
||||
|
||||
## 0.24.0
|
||||
|
||||
* Handle external URLs in `this.redirect` ([#490](https://github.com/sveltejs/sapper/issues/490))
|
||||
* Strip leading `/` from basepath ([#495](https://github.com/sveltejs/sapper/issues/495))
|
||||
* Treat duplicate query string parameters as arrays ([#497](https://github.com/sveltejs/sapper/issues/497))
|
||||
* Don't buffer `stdout` and `stderr` ([#305](https://github.com/sveltejs/sapper/issues/305))
|
||||
* Posixify `build_dir` ([#498](https://github.com/sveltejs/sapper/pull/498))
|
||||
* Use `page[XY]Offset` instead of `scroll[XY]` ([#480](https://github.com/sveltejs/sapper/issues/480))
|
||||
|
||||
## 0.23.5
|
||||
|
||||
* Include lazily-imported CSS in main CSS chunk ([#492](https://github.com/sveltejs/sapper/pull/492))
|
||||
* Make search param decoding spec-compliant ([#493](https://github.com/sveltejs/sapper/pull/493))
|
||||
* Handle async route errors ([#488](https://github.com/sveltejs/sapper/pull/488))
|
||||
|
||||
## 0.23.4
|
||||
|
||||
* Ignore empty anchors when exporting ([#491](https://github.com/sveltejs/sapper/pull/491))
|
||||
|
||||
## 0.23.3
|
||||
|
||||
* Clear `error` and `status` on successful render ([#477](https://github.com/sveltejs/sapper/pull/477))
|
||||
|
||||
## 0.23.2
|
||||
|
||||
* Fix entry point CSS ([#471](https://github.com/sveltejs/sapper/pull/471))
|
||||
|
||||
## 0.23.1
|
||||
|
||||
* Scroll to deeplink that matches current URL ([#472](https://github.com/sveltejs/sapper/pull/472))
|
||||
* Scroll to deeplink on another page ([#341](https://github.com/sveltejs/sapper/issues/341))
|
||||
|
||||
## 0.23.0
|
||||
|
||||
* Overhaul internal APIs ([#468](https://github.com/sveltejs/sapper/pull/468))
|
||||
* Remove unused `sapper start` and `sapper upgrade` ([#468](https://github.com/sveltejs/sapper/pull/468))
|
||||
* Remove magic environment variables ([#469](https://github.com/sveltejs/sapper/pull/469))
|
||||
* Preserve SSI comments ([#470](https://github.com/sveltejs/sapper/pull/470))
|
||||
|
||||
## 0.22.10
|
||||
|
||||
* Handle `sapper-noscroll` attribute on `<a>` elements ([#376](https://github.com/sveltejs/sapper/issues/376))
|
||||
* Fix CSS paths when using a base path ([#466](https://github.com/sveltejs/sapper/pull/466))
|
||||
|
||||
## 0.22.9
|
||||
|
||||
* Fix legacy builds ([#462](https://github.com/sveltejs/sapper/pull/462))
|
||||
|
||||
## 0.22.8
|
||||
|
||||
* Ensure CSS placeholders are overwritten ([#462](https://github.com/sveltejs/sapper/pull/462))
|
||||
|
||||
## 0.22.7
|
||||
|
||||
* Fix cookies ([#460](https://github.com/sveltejs/sapper/pull/460))
|
||||
|
||||
## 0.22.6
|
||||
|
||||
* Normalise chunk filenames on Windows ([#456](https://github.com/sveltejs/sapper/pull/456))
|
||||
* Load modules with credentials ([#458](https://github.com/sveltejs/sapper/pull/458))
|
||||
|
||||
## 0.22.5
|
||||
|
||||
* Fix `sapper dev`. Oops.
|
||||
|
||||
## 0.22.4
|
||||
|
||||
* Ensure launcher does not overwrite a module ([#455](https://github.com/sveltejs/sapper/pull/455))
|
||||
|
||||
## 0.22.3
|
||||
|
||||
* Prevent server from accidentally importing dev client
|
||||
|
||||
## 0.22.2
|
||||
|
||||
* Make paths in generated code relative to project
|
||||
|
||||
## 0.22.1
|
||||
|
||||
* Fix `pkg.files`
|
||||
|
||||
## 0.22.0
|
||||
|
||||
* Move generated files into `__sapper__` ([#453](https://github.com/sveltejs/sapper/pull/453))
|
||||
* Change default build and export directories to `__sapper__/build` and `__sapper__/export` ([#453](https://github.com/sveltejs/sapper/pull/453))
|
||||
|
||||
## 0.21.1
|
||||
|
||||
* Read template from build directory in production
|
||||
|
||||
## 0.21.0
|
||||
|
||||
* Change project folder structure ([#432](https://github.com/sveltejs/sapper/issues/432))
|
||||
* Escape filenames ([#446](https://github.com/sveltejs/sapper/pull/446/))
|
||||
|
||||
## 0.20.4
|
||||
|
||||
* Fix legacy build CSS ([#439](https://github.com/sveltejs/sapper/issues/439))
|
||||
* Enable debugging in Chrome and VSCode ([#435](https://github.com/sveltejs/sapper/issues/435))
|
||||
|
||||
## 0.20.3
|
||||
|
||||
* Inject `nonce` attribute if `res.locals.nonce` is present ([#424](https://github.com/sveltejs/sapper/pull/424))
|
||||
* Prevent service worker caching ([#428](https://github.com/sveltejs/sapper/pull/428))
|
||||
* Consistent caching for HTML responses ([#429](https://github.com/sveltejs/sapper/pull/429))
|
||||
|
||||
## 0.20.2
|
||||
|
||||
* Add `immutable` cache control header for hashed assets ([#425](https://github.com/sveltejs/sapper/pull/425))
|
||||
* Handle value-less query string params ([#426](https://github.com/sveltejs/sapper/issues/426))
|
||||
|
||||
## 0.20.1
|
||||
|
||||
* Update shimport
|
||||
|
||||
## 0.20.0
|
||||
|
||||
* Decode `req.params` and `req.query` ([#417](https://github.com/sveltejs/sapper/issues/417))
|
||||
* Decode URLs before writing files in `sapper export` ([#414](https://github.com/sveltejs/sapper/pull/414))
|
||||
* Generate server sourcemaps for Rollup apps in dev mode ([#418](https://github.com/sveltejs/sapper/pull/418))
|
||||
|
||||
## 0.19.3
|
||||
|
||||
* Better unicode route handling ([#347](https://github.com/sveltejs/sapper/issues/347))
|
||||
|
||||
## 0.19.2
|
||||
|
||||
* Ignore editor tmp files ([#220](https://github.com/sveltejs/sapper/issues/220))
|
||||
* Ignore clicks an `<a>` element without `href` ([#235](https://github.com/sveltejs/sapper/issues/235))
|
||||
* Allow routes that are reserved JavaScript words ([#315](https://github.com/sveltejs/sapper/issues/315))
|
||||
* Print out webpack errors ([#403](https://github.com/sveltejs/sapper/issues/403))
|
||||
|
||||
## 0.19.1
|
||||
|
||||
* Don't include local origin in export redirects ([#409](https://github.com/sveltejs/sapper/pull/409))
|
||||
|
||||
## 0.19.0
|
||||
|
||||
* Extract styles out of JS into .css files, for Rollup apps ([#388](https://github.com/sveltejs/sapper/issues/388))
|
||||
* Fix `prefetchRoutes` ([#380](https://github.com/sveltejs/sapper/issues/380))
|
||||
|
||||
## 0.18.7
|
||||
|
||||
* Support differential bundling for Rollup apps via a `--legacy` flag ([#280](https://github.com/sveltejs/sapper/issues/280))
|
||||
|
||||
## 0.18.6
|
||||
|
||||
* Bundle missing dependency
|
||||
|
||||
## 0.18.5
|
||||
|
||||
* Bugfix
|
||||
|
||||
## 0.18.4
|
||||
|
||||
* Handle non-Sapper responses when exporting ([#382](https://github.com/sveltejs/sapper/issues/392))
|
||||
* Add `--dev-port` flag to `sapper dev` ([#381](https://github.com/sveltejs/sapper/issues/381))
|
||||
|
||||
## 0.18.3
|
||||
|
||||
* Fix service worker Rollup build config
|
||||
|
||||
## 0.18.2
|
||||
|
||||
* Update `pkg.files`
|
||||
|
||||
## 0.18.1
|
||||
|
||||
* Add live reloading ([#385](https://github.com/sveltejs/sapper/issues/385))
|
||||
|
||||
## 0.18.0
|
||||
|
||||
* Rollup support ([#379](https://github.com/sveltejs/sapper/pull/379))
|
||||
* Fail `export` if a page times out (configurable with `--timeout`) ([#378](https://github.com/sveltejs/sapper/pull/378))
|
||||
|
||||
## 0.17.1
|
||||
|
||||
* Print which file is causing build errors/warnings ([#371](https://github.com/sveltejs/sapper/pull/371))
|
||||
|
||||
## 0.17.0
|
||||
|
||||
* Use `cheap-watch` instead of `chokidar` ([#364](https://github.com/sveltejs/sapper/issues/364))
|
||||
|
||||
## 0.16.1
|
||||
|
||||
* Fix file watching regression in previous version
|
||||
|
||||
## 0.16.0
|
||||
|
||||
* Slim down installed package ([#363](https://github.com/sveltejs/sapper/pull/363))
|
||||
|
||||
## 0.15.8
|
||||
|
||||
* Only set `preloading: true` on navigation, not prefetch ([#352](https://github.com/sveltejs/sapper/issues/352))
|
||||
* Provide fallback for missing preload errors ([#361](https://github.com/sveltejs/sapper/pull/361))
|
||||
|
||||
## 0.15.7
|
||||
|
||||
* Strip leading slash from redirects ([#291](https://github.com/sveltejs/sapper/issues/291))
|
||||
* Pass `(req, res)` to store getter ([#344](https://github.com/sveltejs/sapper/issues/344))
|
||||
|
||||
## 0.15.6
|
||||
|
||||
* Fix exporting with custom basepath ([#342](https://github.com/sveltejs/sapper/pull/342))
|
||||
|
||||
## 0.15.5
|
||||
|
||||
* Faster `export` with more explanatory output ([#335](https://github.com/sveltejs/sapper/pull/335))
|
||||
* Only blur `activeElement` if it exists ([#332](https://github.com/sveltejs/sapper/issues/332))
|
||||
* Don't emit `client_info.json` or `server_info.json` ([#318](https://github.com/sveltejs/sapper/issues/318))
|
||||
|
||||
## 0.15.4
|
||||
|
||||
* Add `ignore` option ([#326](https://github.com/sveltejs/sapper/pull/326))
|
||||
|
||||
## 0.15.3
|
||||
|
||||
* Crawl pages in parallel when exporting ([#329](https://github.com/sveltejs/sapper/pull/329))
|
||||
* Don't minify inline JS when exporting ([#328](https://github.com/sveltejs/sapper/pull/328))
|
||||
|
||||
## 0.15.2
|
||||
|
||||
* Collapse component chains where no intermediate layout component is specified ([#312](https://github.com/sveltejs/sapper/issues/312))
|
||||
|
||||
## 0.15.1
|
||||
|
||||
* Prevent confusing error when no root layout is specified
|
||||
|
||||
## 0.15.0
|
||||
|
||||
* Nested routes (consult [migration guide](https://sapper.svelte.technology/guide#0-14-to-0-15) and docs on [layouts](https://sapper.svelte.technology/guide#layouts)) ([#262](https://github.com/sveltejs/sapper/issues/262))
|
||||
|
||||
## 0.14.2
|
||||
|
||||
* Prevent unsafe replacements ([#307](https://github.com/sveltejs/sapper/pull/307))
|
||||
|
||||
## 0.14.1
|
||||
|
||||
* Route parameters can be qualified with regex characters ([#283](https://github.com/sveltejs/sapper/pull/283))
|
||||
|
||||
## 0.14.0
|
||||
|
||||
* `4xx.html` and `5xx.html` are replaced with `_error.html` ([#209](https://github.com/sveltejs/sapper/issues/209))
|
||||
* Treat `foo/index.json.js` and `foo.json.js` as equivalents ([#297](https://github.com/sveltejs/sapper/issues/297))
|
||||
* Return a promise from `goto` ([#270](https://github.com/sveltejs/sapper/issues/270))
|
||||
* Use store when rendering error pages ([#293](https://github.com/sveltejs/sapper/issues/293))
|
||||
* Prevent console errors when visiting an error page ([#279](https://github.com/sveltejs/sapper/issues/279))
|
||||
|
||||
## 0.13.6
|
||||
|
||||
* Fix `baseUrl` synthesis ([#296](https://github.com/sveltejs/sapper/issues/296))
|
||||
|
||||
## 0.13.5
|
||||
|
||||
* Fix handling of fatal errors ([#289](https://github.com/sveltejs/sapper/issues/289))
|
||||
|
||||
## 0.13.4
|
||||
|
||||
* Focus `<body>` after navigation ([#287](https://github.com/sveltejs/sapper/issues/287))
|
||||
* Fix timing of hot reload updates
|
||||
* Emit `fatal` event if server crashes ([#285](https://github.com/sveltejs/sapper/pull/285))
|
||||
* Emit `stdout` and `stderr` events on dev watcher ([#285](https://github.com/sveltejs/sapper/pull/285))
|
||||
* Always refresh client assets in dev ([#286](https://github.com/sveltejs/sapper/pull/286))
|
||||
* Correctly initialise rebuild stats
|
||||
|
||||
## 0.13.3
|
||||
|
||||
* Make `fatal` events clonable for IPC purposes
|
||||
|
||||
## 0.13.2
|
||||
|
||||
* Emit a `basepath` event ([#284](https://github.com/sveltejs/sapper/pull/284))
|
||||
|
||||
## 0.13.1
|
||||
|
||||
* Reinstate ten-second interval between dev server heartbeats ([#276](https://github.com/sveltejs/sapper/issues/276))
|
||||
|
||||
## 0.13.0
|
||||
|
||||
* Expose `dev`, `build`, `export` and `find_page` APIs ([#272](https://github.com/sveltejs/sapper/issues/272))
|
||||
|
||||
## 0.12.0
|
||||
|
||||
* Each app has a single `<App>` component. See the [migration guide](https://sapper.svelte.technology/guide#0-11-to-0-12) for more information ([#157](https://github.com/sveltejs/sapper/issues/157))
|
||||
* Process exits with error code 1 if build/export fails ([#208](https://github.com/sveltejs/sapper/issues/208))
|
||||
|
||||
## 0.11.1
|
||||
|
||||
* Limit routes with leading dots to `.well-known` URIs ([#252](https://github.com/sveltejs/sapper/issues/252))
|
||||
* Allow server routes to sit in front of pages ([#236](https://github.com/sveltejs/sapper/pull/236))
|
||||
|
||||
## 0.11.0
|
||||
|
||||
* Create launcher file ([#240](https://github.com/sveltejs/sapper/issues/240))
|
||||
* Only keep necessary parts of webpack stats ([#251](https://github.com/sveltejs/sapper/pull/251))
|
||||
* Allow `NODE_ENV` to be overridden when building ([#241](https://github.com/sveltejs/sapper/issues/241))
|
||||
|
||||
## 0.10.7
|
||||
|
||||
* Allow routes to have a leading `.` ([#243](https://github.com/sveltejs/sapper/pull/243))
|
||||
* Only encode necessary characters in routes ([#234](https://github.com/sveltejs/sapper/pull/234))
|
||||
* Preserve existing `process.env` when exporting ([#245](https://github.com/sveltejs/sapper/pull/245))
|
||||
|
||||
## 0.10.6
|
||||
|
||||
* Fix error reporting in `sapper start`
|
||||
|
||||
## 0.10.5
|
||||
|
||||
* Fix missing service worker ([#231](https://github.com/sveltejs/sapper/pull/231))
|
||||
|
||||
## 0.10.4
|
||||
|
||||
* Upgrade chokidar, this time with a fix ([#227](https://github.com/sveltejs/sapper/pull/227))
|
||||
|
||||
## 0.10.3
|
||||
|
||||
* Downgrade chokidar ([#212](https://github.com/sveltejs/sapper/issues/212))
|
||||
|
||||
## 0.10.2
|
||||
|
||||
* Attach `store` to error pages
|
||||
* Fix sorting edge case ([#215](https://github.com/sveltejs/sapper/pull/215))
|
||||
|
||||
## 0.10.1
|
||||
|
||||
* Fix server-side `fetch` paths ([#207](https://github.com/sveltejs/sapper/pull/207))
|
||||
|
||||
## 0.10.0
|
||||
|
||||
* Support mounting on a path (this requires `app/template.html` to include `%sapper.base%`) ([#180](https://github.com/sveltejs/sapper/issues/180))
|
||||
* Support per-request server-side `Store` with client-side hydration ([#178](https://github.com/sveltejs/sapper/issues/178))
|
||||
* Add `this.fetch` to `preload`, with credentials support ([#178](https://github.com/sveltejs/sapper/issues/178))
|
||||
* Exclude sourcemaps from preload links and `<script>` block ([#204](https://github.com/sveltejs/sapper/pull/204))
|
||||
* Register service worker in `<script>` block
|
||||
|
||||
|
||||
## 0.9.6
|
||||
|
||||
* Whoops — `tslib` is a runtime dependency
|
||||
|
||||
## 0.9.5
|
||||
|
||||
* Stringify clorox output ([#197](https://github.com/sveltejs/sapper/pull/197))
|
||||
|
||||
## 0.9.4
|
||||
|
||||
* Add `SAPPER_BASE` and `SAPPER_APP` environment variables ([#181](https://github.com/sveltejs/sapper/issues/181))
|
||||
* Minify template in `sapper build` ([#15](https://github.com/sveltejs/sapper/issues/15))
|
||||
* Minify all HTML files in `sapper export` ([#172](https://github.com/sveltejs/sapper/issues/172))
|
||||
* Log exported files ([#195](https://github.com/sveltejs/sapper/pull/195))
|
||||
* Add `--open`/`-o` flag to `sapper dev` and `sapper start` ([#186](https://github.com/sveltejs/sapper/issues/186))
|
||||
|
||||
## 0.9.3
|
||||
|
||||
* Fix path to `sapper-dev-client`
|
||||
|
||||
## 0.9.2
|
||||
|
||||
* Include `dist` files in package
|
||||
|
||||
## 0.9.1
|
||||
|
||||
* Include `sapper` bin
|
||||
|
||||
## 0.9.0
|
||||
|
||||
* Use `devalue` instead of `serialize-javascript`, allowing `preload` to return non-POJOs and cyclical/repeated references, but *not* functions ([#112](https://github.com/sveltejs/sapper/issues/112))
|
||||
* Kill child process if webpack crashes ([#177](https://github.com/sveltejs/sapper/issues/177))
|
||||
* Support HMR on remote devices ([#165](https://github.com/sveltejs/sapper/issues/165))
|
||||
* Remove hard-coded port (([#169](https://github.com/sveltejs/sapper/issues/169)))
|
||||
* Allow non-JS files, e.g. TypeScript to be used as entry points and server routes ([#57](https://github.com/sveltejs/sapper/issues/57))
|
||||
* Faster startup ([#173](https://github.com/sveltejs/sapper/issues/173))
|
||||
|
||||
## 0.8.4
|
||||
|
||||
* Fix route sorting ([#175](https://github.com/sveltejs/sapper/pull/175))
|
||||
|
||||
## 0.8.3
|
||||
|
||||
* Automatically select available port, or use `--port` flag for `dev` and `start` ([#169](https://github.com/sveltejs/sapper/issues/169))
|
||||
* Show stats after build/export ([#168](https://github.com/sveltejs/sapper/issues/168))
|
||||
* Various CLI improvements ([#170](https://github.com/sveltejs/sapper/pull/170))
|
||||
|
||||
## 0.8.2
|
||||
|
||||
* Rename `preloadRoutes` to `prefetchRoutes` ([#166](https://github.com/sveltejs/sapper/issues/166))
|
||||
|
||||
## 0.8.1
|
||||
|
||||
* Add `sapper start` command, for running an app built with `sapper build` ([#163](https://github.com/sveltejs/sapper/issues/163))
|
||||
|
||||
## 0.8.0
|
||||
|
||||
* Update to webpack 4
|
||||
* Add `preloadRoutes` function — secondary routes are no longer automatically preloaded ([#160](https://github.com/sveltejs/sapper/issues/160))
|
||||
* `sapper build` outputs to `build`, `sapper build custom-dir` outputs to `custom-dir` ([#150](https://github.com/sveltejs/sapper/pull/150))
|
||||
* `sapper export` outputs to `export`, `sapper export custom-dir` outputs to `custom-dir` ([#150](https://github.com/sveltejs/sapper/pull/150))
|
||||
* Improved logging ([#158](https://github.com/sveltejs/sapper/pull/158))
|
||||
* URI-encode routes ([#103](https://github.com/sveltejs/sapper/issues/103))
|
||||
* Various performance and stability improvements ([#152](https://github.com/sveltejs/sapper/pull/152))
|
||||
|
||||
## 0.7.6
|
||||
|
||||
* Prevent client-side navigation to server route ([#145](https://github.com/sveltejs/sapper/issues/145))
|
||||
* Don't serve error page for server route errors ([#138](https://github.com/sveltejs/sapper/issues/138))
|
||||
|
||||
## 0.7.5
|
||||
|
||||
* Allow dynamic parameters inside route parts ([#139](https://github.com/sveltejs/sapper/issues/139))
|
||||
|
||||
## 0.7.4
|
||||
|
||||
* Force `NODE_ENV='production'` when running `build` or `export` ([#141](https://github.com/sveltejs/sapper/issues/141))
|
||||
* Use source-map-support ([#134](https://github.com/sveltejs/sapper/pull/134))
|
||||
|
||||
## 0.7.3
|
||||
|
||||
* Handle webpack assets that are arrays instead of strings ([#131](https://github.com/sveltejs/sapper/pull/131))
|
||||
|
||||
38
README.md
38
README.md
@@ -31,6 +31,44 @@ npm run build
|
||||
npm start
|
||||
```
|
||||
|
||||
## Development
|
||||
|
||||
Pull requests are encouraged and always welcome. [Pick an issue](https://github.com/sveltejs/sapper/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc) and help us out!
|
||||
|
||||
To install and work on Sapper locally:
|
||||
|
||||
```bash
|
||||
git clone git@github.com:sveltejs/sapper.git
|
||||
cd sapper
|
||||
npm install
|
||||
npm run dev
|
||||
```
|
||||
|
||||
### Linking to a Live Project
|
||||
|
||||
You can make changes locally to Sapper and test it against a local Sapper project. For a quick project that takes almost no setup, use the default [sapper-template](https://github.com/sveltejs/sapper-template) project. Instruction on setup are found in that project repository.
|
||||
|
||||
To link Sapper to your project, from the root of your local Sapper git checkout:
|
||||
|
||||
```bash
|
||||
cd sapper
|
||||
npm link
|
||||
```
|
||||
|
||||
Then, to link from `sapper-template` (or any other given project):
|
||||
|
||||
```bash
|
||||
cd sapper-template
|
||||
npm link sapper
|
||||
```
|
||||
|
||||
You should be good to test changes locally.
|
||||
|
||||
### Running Tests
|
||||
|
||||
```bash
|
||||
npm run test
|
||||
```
|
||||
|
||||
## License
|
||||
|
||||
|
||||
@@ -10,11 +10,11 @@ build: off
|
||||
environment:
|
||||
matrix:
|
||||
# node.js
|
||||
- nodejs_version: stable
|
||||
- nodejs_version: 10.5
|
||||
|
||||
install:
|
||||
- ps: Install-Product node $env:nodejs_version
|
||||
- npm install
|
||||
- npm ci
|
||||
|
||||
test_script:
|
||||
- node --version && npm --version
|
||||
|
||||
1
config/rollup.js
Normal file
1
config/rollup.js
Normal file
@@ -0,0 +1 @@
|
||||
module.exports = require('../dist/rollup.js');
|
||||
1
config/webpack.js
Normal file
1
config/webpack.js
Normal file
@@ -0,0 +1 @@
|
||||
module.exports = require('../dist/webpack.js');
|
||||
@@ -1,9 +0,0 @@
|
||||
{
|
||||
"baseUrl": "http://localhost:3000",
|
||||
"videoRecording": false,
|
||||
"fixturesFolder": "test/cypress/fixtures",
|
||||
"integrationFolder": "test/cypress/integration",
|
||||
"pluginsFile": false,
|
||||
"screenshotsFolder": "test/cypress/screenshots",
|
||||
"supportFile": "test/cypress/support/index.js"
|
||||
}
|
||||
1
index.js
Normal file
1
index.js
Normal file
@@ -0,0 +1 @@
|
||||
throw new Error(`As of Sapper 0.22, you should not import 'sapper' directly. See https://sapper.svelte.technology/guide#0-21-to-0-22 for more information`);
|
||||
@@ -1,4 +1,4 @@
|
||||
--require source-map-support/register
|
||||
--require sucrase/register
|
||||
--recursive
|
||||
test/unit/**/*.js
|
||||
test/common/test.js
|
||||
test/apps/*/test.ts
|
||||
6709
package-lock.json
generated
Normal file
6709
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
116
package.json
116
package.json
@@ -1,79 +1,85 @@
|
||||
{
|
||||
"name": "sapper",
|
||||
"version": "0.7.3",
|
||||
"version": "0.26.0-alpha.3",
|
||||
"description": "Military-grade apps, engineered by Svelte",
|
||||
"main": "middleware.js",
|
||||
"bin": {
|
||||
"sapper": "cli.js"
|
||||
"sapper": "./sapper"
|
||||
},
|
||||
"files": [
|
||||
"cli.js",
|
||||
"core.js",
|
||||
"middleware.js",
|
||||
"runtime",
|
||||
"runtime.js",
|
||||
"hmr-client.js",
|
||||
"webpack"
|
||||
"*.js",
|
||||
"webpack",
|
||||
"config",
|
||||
"sapper",
|
||||
"dist/*.js",
|
||||
"runtime/*.mjs",
|
||||
"runtime/internal"
|
||||
],
|
||||
"directories": {
|
||||
"test": "test"
|
||||
},
|
||||
"dependencies": {
|
||||
"chalk": "^2.3.0",
|
||||
"cheerio": "^1.0.0-rc.2",
|
||||
"chokidar": "^1.7.0",
|
||||
"code-frame": "^5.0.0",
|
||||
"escape-html": "^1.0.3",
|
||||
"express": "^4.16.2",
|
||||
"get-port": "^3.2.0",
|
||||
"glob": "^7.1.2",
|
||||
"locate-character": "^2.0.5",
|
||||
"mime": "^2.2.0",
|
||||
"mkdirp": "^0.5.1",
|
||||
"mri": "^1.1.0",
|
||||
"node-fetch": "^1.7.3",
|
||||
"relative": "^3.0.2",
|
||||
"require-relative": "^0.8.7",
|
||||
"rimraf": "^2.6.2",
|
||||
"sander": "^0.6.0",
|
||||
"serialize-javascript": "^1.4.0",
|
||||
"tslib": "^1.8.1",
|
||||
"url-parse": "^1.2.0",
|
||||
"wait-port": "^0.2.2",
|
||||
"walk-sync": "^0.3.2",
|
||||
"webpack": "^3.10.0"
|
||||
"html-minifier": "^3.5.21",
|
||||
"shimport": "0.0.14",
|
||||
"source-map-support": "^0.5.10",
|
||||
"sourcemap-codec": "^1.4.4",
|
||||
"string-hash": "^1.1.3",
|
||||
"tslib": "^1.9.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@std/esm": "^0.19.7",
|
||||
"@types/glob": "^5.0.34",
|
||||
"@types/mkdirp": "^0.5.2",
|
||||
"@types/mocha": "^5.2.5",
|
||||
"@types/node": "^10.12.21",
|
||||
"@types/puppeteer": "^1.11.3",
|
||||
"@types/rimraf": "^2.0.2",
|
||||
"compression": "^1.7.1",
|
||||
"css-loader": "^0.28.7",
|
||||
"electron": "^1.8.2",
|
||||
"eslint": "^4.13.1",
|
||||
"eslint-plugin-import": "^2.8.0",
|
||||
"mocha": "^4.0.1",
|
||||
"nightmare": "^2.10.0",
|
||||
"npm-run-all": "^4.1.2",
|
||||
"rollup": "^0.53.0",
|
||||
"rollup-plugin-json": "^2.3.0",
|
||||
"agadoo": "^1.0.1",
|
||||
"cheap-watch": "^1.0.2",
|
||||
"cookie": "^0.3.1",
|
||||
"devalue": "^1.1.0",
|
||||
"eslint": "^5.12.1",
|
||||
"eslint-plugin-import": "^2.16.0",
|
||||
"kleur": "^3.0.1",
|
||||
"mkdirp": "^0.5.1",
|
||||
"mocha": "^5.2.0",
|
||||
"node-fetch": "^2.3.0",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"polka": "^0.5.1",
|
||||
"port-authority": "^1.0.5",
|
||||
"pretty-bytes": "^5.1.0",
|
||||
"puppeteer": "^1.12.0",
|
||||
"require-relative": "^0.8.7",
|
||||
"rimraf": "^2.6.3",
|
||||
"rollup": "^1.1.2",
|
||||
"rollup-plugin-commonjs": "^9.2.0",
|
||||
"rollup-plugin-json": "^3.1.0",
|
||||
"rollup-plugin-node-resolve": "^4.0.0",
|
||||
"rollup-plugin-replace": "^2.1.0",
|
||||
"rollup-plugin-string": "^2.0.2",
|
||||
"rollup-plugin-typescript": "^0.8.1",
|
||||
"source-map-support": "^0.5.2",
|
||||
"style-loader": "^0.19.1",
|
||||
"svelte": "^1.49.1",
|
||||
"svelte-loader": "^2.3.2",
|
||||
"ts-node": "^4.1.0",
|
||||
"typescript": "^2.6.2"
|
||||
"rollup-plugin-sucrase": "^2.1.0",
|
||||
"rollup-plugin-svelte": "^5.0.1",
|
||||
"rollup-plugin-typescript": "^1.0.0",
|
||||
"sade": "^1.4.2",
|
||||
"sander": "^0.6.0",
|
||||
"sirv": "^0.2.2",
|
||||
"sucrase": "^3.9.5",
|
||||
"svelte": "^3.0.0-alpha27",
|
||||
"svelte-loader": "^2.12.0",
|
||||
"ts-node": "^8.0.2",
|
||||
"typescript": "^3.3.1",
|
||||
"webpack": "^4.29.0",
|
||||
"webpack-format-messages": "^2.0.5",
|
||||
"yootils": "0.0.14"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"svelte": "^3.0.0"
|
||||
},
|
||||
"scripts": {
|
||||
"cy:open": "cypress open",
|
||||
"test": "mocha --opts mocha.opts",
|
||||
"pretest": "npm run build",
|
||||
"build": "rollup -c",
|
||||
"build": "rm -rf dist && rollup -c",
|
||||
"prepare": "npm run build",
|
||||
"dev": "rollup -cw",
|
||||
"prepublish": "npm test"
|
||||
"prepublishOnly": "npm test",
|
||||
"update_mime_types": "curl http://svn.apache.org/repos/asf/httpd/httpd/trunk/docs/conf/mime.types | grep -e \"^[^#]\" > runtime/src/server/middleware/mime-types.md"
|
||||
},
|
||||
"repository": "https://github.com/sveltejs/sapper",
|
||||
"keywords": [
|
||||
|
||||
@@ -1,7 +1,10 @@
|
||||
import typescript from 'rollup-plugin-typescript';
|
||||
import sucrase from 'rollup-plugin-sucrase';
|
||||
import string from 'rollup-plugin-string';
|
||||
import json from 'rollup-plugin-json';
|
||||
import resolve from 'rollup-plugin-node-resolve';
|
||||
import commonjs from 'rollup-plugin-commonjs';
|
||||
import pkg from './package.json';
|
||||
import { builtinModules } from 'module';
|
||||
|
||||
const external = [].concat(
|
||||
Object.keys(pkg.dependencies),
|
||||
@@ -9,35 +12,57 @@ const external = [].concat(
|
||||
'sapper/core.js'
|
||||
);
|
||||
|
||||
const paths = {
|
||||
'sapper/core.js': './core.js'
|
||||
};
|
||||
|
||||
const plugins = [
|
||||
string({
|
||||
include: '**/*.md'
|
||||
}),
|
||||
json(),
|
||||
typescript({
|
||||
typescript: require('typescript')
|
||||
})
|
||||
];
|
||||
function template(kind, external) {
|
||||
return {
|
||||
input: `runtime/src/${kind}/index.ts`,
|
||||
output: {
|
||||
file: `runtime/${kind}.mjs`,
|
||||
format: 'es',
|
||||
paths: id => id.replace('@sapper', '.')
|
||||
},
|
||||
external,
|
||||
plugins: [
|
||||
resolve({
|
||||
extensions: ['.mjs', '.js', '.ts']
|
||||
}),
|
||||
commonjs(),
|
||||
string({
|
||||
include: '**/*.md'
|
||||
}),
|
||||
sucrase({
|
||||
transforms: ['typescript']
|
||||
})
|
||||
]
|
||||
};
|
||||
}
|
||||
|
||||
export default [
|
||||
{ name: 'cli', banner: true },
|
||||
{ name: 'core' },
|
||||
{ name: 'middleware' },
|
||||
{ name: 'runtime', format: 'es' },
|
||||
{ name: 'webpack', file: 'webpack/config' }
|
||||
].map(obj => ({
|
||||
input: `src/${obj.name}/index.ts`,
|
||||
output: {
|
||||
file: `${obj.file || obj.name}.js`,
|
||||
format: obj.format || 'cjs',
|
||||
banner: obj.banner && '#!/usr/bin/env node',
|
||||
paths,
|
||||
sourcemap: true
|
||||
},
|
||||
external,
|
||||
plugins
|
||||
}));
|
||||
template('app', id => /^(svelte\/?|@sapper\/)/.test(id)),
|
||||
template('server', id => builtinModules.includes(id)),
|
||||
|
||||
{
|
||||
input: [
|
||||
`src/api.ts`,
|
||||
`src/cli.ts`,
|
||||
`src/core.ts`,
|
||||
`src/config/rollup.ts`,
|
||||
`src/config/webpack.ts`
|
||||
],
|
||||
output: {
|
||||
dir: 'dist',
|
||||
format: 'cjs',
|
||||
sourcemap: true
|
||||
},
|
||||
external,
|
||||
plugins: [
|
||||
json(),
|
||||
resolve({
|
||||
extensions: ['.mjs', '.js', '.ts']
|
||||
}),
|
||||
commonjs(),
|
||||
sucrase({
|
||||
transforms: ['typescript']
|
||||
})
|
||||
]
|
||||
}
|
||||
];
|
||||
@@ -1 +0,0 @@
|
||||
This directory exists for legacy reasons and should be deleted before releasing version 1.
|
||||
@@ -1,2 +0,0 @@
|
||||
console.error('sapper/runtime/app.js has been deprecated in favour of sapper/runtime.js');
|
||||
export * from '../runtime.js';
|
||||
12
runtime/internal/Sapper.html
Normal file
12
runtime/internal/Sapper.html
Normal file
@@ -0,0 +1,12 @@
|
||||
<script>
|
||||
import { setContext } from 'svelte';
|
||||
import { CONTEXT_KEY } from './shared';
|
||||
|
||||
export let Root;
|
||||
export let props;
|
||||
export let session;
|
||||
|
||||
setContext(CONTEXT_KEY, session);
|
||||
</script>
|
||||
|
||||
<Root {...props}/>
|
||||
1
runtime/internal/layout.html
Normal file
1
runtime/internal/layout.html
Normal file
@@ -0,0 +1 @@
|
||||
<svelte:component this={child.component} {...child.props}/>
|
||||
10
runtime/internal/shared.mjs
Normal file
10
runtime/internal/shared.mjs
Normal file
@@ -0,0 +1,10 @@
|
||||
import { writable } from 'svelte/store';
|
||||
|
||||
export const stores = {
|
||||
preloading: writable(false),
|
||||
page: writable(null)
|
||||
};
|
||||
|
||||
export const CONTEXT_KEY = {};
|
||||
|
||||
export const preload = () => ({});
|
||||
341
runtime/src/app/app.ts
Normal file
341
runtime/src/app/app.ts
Normal file
@@ -0,0 +1,341 @@
|
||||
import { writable } from 'svelte/store.mjs';
|
||||
import Sapper from '@sapper/internal/Sapper.html';
|
||||
import { stores } from '@sapper/internal/shared';
|
||||
import { Root, root_preload, ErrorComponent, ignore, components, routes } from '@sapper/internal/manifest-client';
|
||||
import {
|
||||
Target,
|
||||
ScrollPosition,
|
||||
Component,
|
||||
Redirect,
|
||||
ComponentLoader,
|
||||
ComponentConstructor,
|
||||
Route,
|
||||
Page
|
||||
} from './types';
|
||||
import goto from './goto';
|
||||
|
||||
declare const __SAPPER__;
|
||||
export const initial_data = typeof __SAPPER__ !== 'undefined' && __SAPPER__;
|
||||
|
||||
let ready = false;
|
||||
let root_component: Component;
|
||||
let current_token: {};
|
||||
let root_preloaded: Promise<any>;
|
||||
let current_branch = [];
|
||||
|
||||
const session = writable(initial_data && initial_data.session);
|
||||
|
||||
let $session;
|
||||
let session_dirty: boolean;
|
||||
|
||||
session.subscribe(async value => {
|
||||
$session = value;
|
||||
|
||||
if (!ready) return;
|
||||
session_dirty = true;
|
||||
|
||||
const target = select_target(new URL(location.href));
|
||||
|
||||
const token = current_token = {};
|
||||
const { redirect, props, branch } = await hydrate_target(target);
|
||||
if (token !== current_token) return; // a secondary navigation happened while we were loading
|
||||
|
||||
await render(redirect, branch, props, target.page);
|
||||
});
|
||||
|
||||
export let prefetching: {
|
||||
href: string;
|
||||
promise: Promise<{ redirect?: Redirect, data?: any }>;
|
||||
} = null;
|
||||
export function set_prefetching(href, promise) {
|
||||
prefetching = { href, promise };
|
||||
}
|
||||
|
||||
export let store;
|
||||
export function set_store(fn) {
|
||||
store = fn(initial_data.store);
|
||||
}
|
||||
|
||||
export let target: Node;
|
||||
export function set_target(element) {
|
||||
target = element;
|
||||
}
|
||||
|
||||
export let uid = 1;
|
||||
export function set_uid(n) {
|
||||
uid = n;
|
||||
}
|
||||
|
||||
export let cid: number;
|
||||
export function set_cid(n) {
|
||||
cid = n;
|
||||
}
|
||||
|
||||
const _history = typeof history !== 'undefined' ? history : {
|
||||
pushState: (state: any, title: string, href: string) => {},
|
||||
replaceState: (state: any, title: string, href: string) => {},
|
||||
scrollRestoration: ''
|
||||
};
|
||||
export { _history as history };
|
||||
|
||||
export const scroll_history: Record<string, ScrollPosition> = {};
|
||||
|
||||
export function select_target(url: URL): Target {
|
||||
if (url.origin !== location.origin) return null;
|
||||
if (!url.pathname.startsWith(initial_data.baseUrl)) return null;
|
||||
|
||||
const path = url.pathname.slice(initial_data.baseUrl.length);
|
||||
|
||||
// avoid accidental clashes between server routes and page routes
|
||||
if (ignore.some(pattern => pattern.test(path))) return;
|
||||
|
||||
for (let i = 0; i < routes.length; i += 1) {
|
||||
const route = routes[i];
|
||||
|
||||
const match = route.pattern.exec(path);
|
||||
if (match) {
|
||||
const query: Record<string, string | string[]> = Object.create(null);
|
||||
if (url.search.length > 0) {
|
||||
url.search.slice(1).split('&').forEach(searchParam => {
|
||||
let [, key, value] = /([^=]*)(?:=(.*))?/.exec(decodeURIComponent(searchParam));
|
||||
value = (value || '').replace(/\+/g, ' ');
|
||||
if (typeof query[key] === 'string') query[key] = [<string>query[key]];
|
||||
if (typeof query[key] === 'object') (query[key] as string[]).push(value);
|
||||
else query[key] = value;
|
||||
});
|
||||
}
|
||||
|
||||
const part = route.parts[route.parts.length - 1];
|
||||
const params = part.params ? part.params(match) : {};
|
||||
|
||||
const page = { path, query, params };
|
||||
|
||||
return { href: url.href, route, match, page };
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export function scroll_state() {
|
||||
return {
|
||||
x: pageXOffset,
|
||||
y: pageYOffset
|
||||
};
|
||||
}
|
||||
|
||||
export async function navigate(target: Target, id: number, noscroll?: boolean, hash?: string): Promise<any> {
|
||||
if (id) {
|
||||
// popstate or initial navigation
|
||||
cid = id;
|
||||
} else {
|
||||
const current_scroll = scroll_state();
|
||||
|
||||
// clicked on a link. preserve scroll state
|
||||
scroll_history[cid] = current_scroll;
|
||||
|
||||
id = cid = ++uid;
|
||||
scroll_history[cid] = noscroll ? current_scroll : { x: 0, y: 0 };
|
||||
}
|
||||
|
||||
cid = id;
|
||||
|
||||
if (root_component) stores.preloading.set(true);
|
||||
|
||||
const loaded = prefetching && prefetching.href === target.href ?
|
||||
prefetching.promise :
|
||||
hydrate_target(target);
|
||||
|
||||
prefetching = null;
|
||||
|
||||
const token = current_token = {};
|
||||
const { redirect, props, branch } = await loaded;
|
||||
if (token !== current_token) return; // a secondary navigation happened while we were loading
|
||||
|
||||
await render(redirect, branch, props, target.page);
|
||||
if (document.activeElement) document.activeElement.blur();
|
||||
|
||||
if (!noscroll) {
|
||||
let scroll = scroll_history[id];
|
||||
|
||||
if (hash) {
|
||||
// scroll is an element id (from a hash), we need to compute y.
|
||||
const deep_linked = document.querySelector(hash);
|
||||
|
||||
if (deep_linked) {
|
||||
scroll = {
|
||||
x: 0,
|
||||
y: deep_linked.getBoundingClientRect().top
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
scroll_history[cid] = scroll;
|
||||
if (scroll) scrollTo(scroll.x, scroll.y);
|
||||
}
|
||||
}
|
||||
|
||||
async function render(redirect: Redirect, branch: any[], props: any, page: Page) {
|
||||
if (redirect) return goto(redirect.location, { replaceState: true });
|
||||
|
||||
stores.page.set(page);
|
||||
stores.preloading.set(false);
|
||||
|
||||
if (root_component) {
|
||||
root_component.props = props;
|
||||
} else {
|
||||
// first load — remove SSR'd <head> contents
|
||||
const start = document.querySelector('#sapper-head-start');
|
||||
const end = document.querySelector('#sapper-head-end');
|
||||
|
||||
if (start && end) {
|
||||
while (start.nextSibling !== end) detach(start.nextSibling);
|
||||
detach(start);
|
||||
detach(end);
|
||||
}
|
||||
|
||||
root_component = new Sapper({
|
||||
target,
|
||||
props: {
|
||||
Root,
|
||||
props,
|
||||
session
|
||||
},
|
||||
hydrate: true
|
||||
});
|
||||
}
|
||||
|
||||
current_branch = branch;
|
||||
ready = true;
|
||||
session_dirty = false;
|
||||
}
|
||||
|
||||
export async function hydrate_target(target: Target): Promise<{
|
||||
redirect?: Redirect;
|
||||
props?: any;
|
||||
branch?: Array<{ Component: ComponentConstructor, preload: (page) => Promise<any>, segment: string }>
|
||||
}> {
|
||||
const { route, page } = target;
|
||||
const segments = page.path.split('/').filter(Boolean);
|
||||
|
||||
let redirect: Redirect = null;
|
||||
let error: { statusCode: number, message: Error | string } = null;
|
||||
|
||||
const preload_context = {
|
||||
fetch: (url: string, opts?: any) => fetch(url, opts),
|
||||
redirect: (statusCode: number, location: string) => {
|
||||
if (redirect && (redirect.statusCode !== statusCode || redirect.location !== location)) {
|
||||
throw new Error(`Conflicting redirects`);
|
||||
}
|
||||
redirect = { statusCode, location };
|
||||
},
|
||||
error: (statusCode: number, message: Error | string) => {
|
||||
error = { statusCode, message };
|
||||
}
|
||||
};
|
||||
|
||||
if (!root_preloaded) {
|
||||
root_preloaded = initial_data.preloaded[0] || root_preload.call(preload_context, {
|
||||
path: page.path,
|
||||
query: page.query,
|
||||
params: {}
|
||||
}, $session);
|
||||
}
|
||||
|
||||
let branch;
|
||||
|
||||
try {
|
||||
branch = await Promise.all(route.parts.map(async (part, i) => {
|
||||
if (!part) return null;
|
||||
|
||||
const segment = segments[i];
|
||||
if (!session_dirty && current_branch[i] && current_branch[i].segment === segment) return current_branch[i];
|
||||
|
||||
const { default: Component, preload } = await load_component(components[part.i]);
|
||||
|
||||
let preloaded;
|
||||
if (ready || !initial_data.preloaded[i + 1]) {
|
||||
preloaded = preload
|
||||
? await preload.call(preload_context, {
|
||||
path: page.path,
|
||||
query: page.query,
|
||||
params: part.params ? part.params(target.match) : {}
|
||||
}, $session)
|
||||
: {};
|
||||
} else {
|
||||
preloaded = initial_data.preloaded[i + 1];
|
||||
}
|
||||
|
||||
return { Component, preloaded, segment };
|
||||
}));
|
||||
} catch (e) {
|
||||
error = { statusCode: 500, message: e };
|
||||
branch = [];
|
||||
}
|
||||
|
||||
if (redirect) return { redirect };
|
||||
|
||||
if (error) {
|
||||
// TODO be nice if this was less of a special case
|
||||
return {
|
||||
props: {
|
||||
child: {
|
||||
component: ErrorComponent,
|
||||
props: {
|
||||
error: typeof error.message === 'string' ? new Error(error.message) : error.message,
|
||||
status: error.statusCode
|
||||
}
|
||||
}
|
||||
},
|
||||
branch
|
||||
};
|
||||
}
|
||||
|
||||
const props = Object.assign({}, await root_preloaded, {
|
||||
child: { segment: segments[0] }
|
||||
});
|
||||
|
||||
let level = props.child;
|
||||
|
||||
branch.forEach((node, i) => {
|
||||
if (!node) return;
|
||||
|
||||
level.component = node.Component;
|
||||
level.props = Object.assign({}, node.preloaded, {
|
||||
child: { segment: segments[i + 1] }
|
||||
});
|
||||
|
||||
level = level.props.child;
|
||||
});
|
||||
|
||||
return { props, branch };
|
||||
}
|
||||
|
||||
function load_css(chunk: string) {
|
||||
const href = `client/${chunk}`;
|
||||
if (document.querySelector(`link[href="${href}"]`)) return;
|
||||
|
||||
return new Promise((fulfil, reject) => {
|
||||
const link = document.createElement('link');
|
||||
link.rel = 'stylesheet';
|
||||
link.href = href;
|
||||
|
||||
link.onload = () => fulfil();
|
||||
link.onerror = reject;
|
||||
|
||||
document.head.appendChild(link);
|
||||
});
|
||||
}
|
||||
|
||||
export function load_component(component: ComponentLoader): Promise<{
|
||||
default: ComponentConstructor,
|
||||
preload?: (input: any) => any
|
||||
}> {
|
||||
// TODO this is temporary — once placeholders are
|
||||
// always rewritten, scratch the ternary
|
||||
const promises: Array<Promise<any>> = (typeof component.css === 'string' ? [] : component.css.map(load_css));
|
||||
promises.unshift(component.js());
|
||||
return Promise.all(promises).then(values => values[0]);
|
||||
}
|
||||
|
||||
function detach(node: Node) {
|
||||
node.parentNode.removeChild(node);
|
||||
}
|
||||
13
runtime/src/app/goto/index.ts
Normal file
13
runtime/src/app/goto/index.ts
Normal file
@@ -0,0 +1,13 @@
|
||||
import { history, select_target, navigate, cid } from '../app';
|
||||
|
||||
export default function goto(href: string, opts = { replaceState: false }) {
|
||||
const target = select_target(new URL(href, document.baseURI));
|
||||
|
||||
if (target) {
|
||||
history[opts.replaceState ? 'replaceState' : 'pushState']({ id: cid }, '', href);
|
||||
return navigate(target, null).then(() => {});
|
||||
}
|
||||
|
||||
location.href = href;
|
||||
return new Promise(f => {}); // never resolves
|
||||
}
|
||||
12
runtime/src/app/index.ts
Normal file
12
runtime/src/app/index.ts
Normal file
@@ -0,0 +1,12 @@
|
||||
import { getContext } from 'svelte';
|
||||
import { CONTEXT_KEY, stores } from '@sapper/internal/shared';
|
||||
|
||||
export const preloading = { subscribe: stores.preloading.subscribe };
|
||||
export const page = { subscribe: stores.page.subscribe };
|
||||
|
||||
export const getSession = () => getContext(CONTEXT_KEY);
|
||||
|
||||
export { default as start } from './start/index';
|
||||
export { default as goto } from './goto/index';
|
||||
export { default as prefetch } from './prefetch/index';
|
||||
export { default as prefetchRoutes } from './prefetchRoutes/index';
|
||||
14
runtime/src/app/prefetch/index.ts
Normal file
14
runtime/src/app/prefetch/index.ts
Normal file
@@ -0,0 +1,14 @@
|
||||
import { select_target, prefetching, set_prefetching, hydrate_target } from '../app';
|
||||
import { Target } from '../types';
|
||||
|
||||
export default function prefetch(href: string) {
|
||||
const target: Target = select_target(new URL(href, document.baseURI));
|
||||
|
||||
if (target) {
|
||||
if (!prefetching || href !== prefetching.href) {
|
||||
set_prefetching(href, hydrate_target(target));
|
||||
}
|
||||
|
||||
return prefetching.promise;
|
||||
}
|
||||
}
|
||||
13
runtime/src/app/prefetchRoutes/index.ts
Normal file
13
runtime/src/app/prefetchRoutes/index.ts
Normal file
@@ -0,0 +1,13 @@
|
||||
import { components, routes } from '@sapper/internal/manifest-client';
|
||||
import { load_component } from '../app';
|
||||
|
||||
export default function prefetchRoutes(pathnames: string[]) {
|
||||
return routes
|
||||
.filter(pathnames
|
||||
? route => pathnames.some(pathname => route.pattern.test(pathname))
|
||||
: () => true
|
||||
)
|
||||
.reduce((promise: Promise<any>, route) => promise.then(() => {
|
||||
return Promise.all(route.parts.map(part => part && load_component(components[part.i])));
|
||||
}), Promise.resolve());
|
||||
}
|
||||
130
runtime/src/app/start/index.ts
Normal file
130
runtime/src/app/start/index.ts
Normal file
@@ -0,0 +1,130 @@
|
||||
import {
|
||||
cid,
|
||||
history,
|
||||
initial_data,
|
||||
navigate,
|
||||
scroll_history,
|
||||
scroll_state,
|
||||
select_target,
|
||||
set_target,
|
||||
uid,
|
||||
set_uid,
|
||||
set_cid
|
||||
} from '../app';
|
||||
import prefetch from '../prefetch/index';
|
||||
|
||||
export default function start(opts: {
|
||||
target: Node
|
||||
}) {
|
||||
if ('scrollRestoration' in history) {
|
||||
history.scrollRestoration = 'manual';
|
||||
}
|
||||
|
||||
set_target(opts.target);
|
||||
|
||||
addEventListener('click', handle_click);
|
||||
addEventListener('popstate', handle_popstate);
|
||||
|
||||
// prefetch
|
||||
addEventListener('touchstart', trigger_prefetch);
|
||||
addEventListener('mousemove', handle_mousemove);
|
||||
|
||||
return Promise.resolve().then(() => {
|
||||
const { hash, href } = location;
|
||||
|
||||
history.replaceState({ id: uid }, '', href);
|
||||
|
||||
if (!initial_data.error) {
|
||||
const target = select_target(new URL(location.href));
|
||||
if (target) return navigate(target, uid, false, hash);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
let mousemove_timeout: NodeJS.Timer;
|
||||
|
||||
function handle_mousemove(event: MouseEvent) {
|
||||
clearTimeout(mousemove_timeout);
|
||||
mousemove_timeout = setTimeout(() => {
|
||||
trigger_prefetch(event);
|
||||
}, 20);
|
||||
}
|
||||
|
||||
function trigger_prefetch(event: MouseEvent | TouchEvent) {
|
||||
const a: HTMLAnchorElement = <HTMLAnchorElement>find_anchor(<Node>event.target);
|
||||
if (!a || a.rel !== 'prefetch') return;
|
||||
|
||||
prefetch(a.href);
|
||||
}
|
||||
|
||||
function handle_click(event: MouseEvent) {
|
||||
// Adapted from https://github.com/visionmedia/page.js
|
||||
// MIT license https://github.com/visionmedia/page.js#license
|
||||
if (which(event) !== 1) return;
|
||||
if (event.metaKey || event.ctrlKey || event.shiftKey) return;
|
||||
if (event.defaultPrevented) return;
|
||||
|
||||
const a: HTMLAnchorElement | SVGAElement = <HTMLAnchorElement | SVGAElement>find_anchor(<Node>event.target);
|
||||
if (!a) return;
|
||||
|
||||
if (!a.href) return;
|
||||
|
||||
// check if link is inside an svg
|
||||
// in this case, both href and target are always inside an object
|
||||
const svg = typeof a.href === 'object' && a.href.constructor.name === 'SVGAnimatedString';
|
||||
const href = String(svg ? (<SVGAElement>a).href.baseVal : a.href);
|
||||
|
||||
if (href === location.href) {
|
||||
if (!location.hash) event.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
// Ignore if tag has
|
||||
// 1. 'download' attribute
|
||||
// 2. rel='external' attribute
|
||||
if (a.hasAttribute('download') || a.getAttribute('rel') === 'external') return;
|
||||
|
||||
// Ignore if <a> has a target
|
||||
if (svg ? (<SVGAElement>a).target.baseVal : a.target) return;
|
||||
|
||||
const url = new URL(href);
|
||||
|
||||
// Don't handle hash changes
|
||||
if (url.pathname === location.pathname && url.search === location.search) return;
|
||||
|
||||
const target = select_target(url);
|
||||
if (target) {
|
||||
const noscroll = a.hasAttribute('sapper-noscroll');
|
||||
navigate(target, null, noscroll, url.hash);
|
||||
event.preventDefault();
|
||||
history.pushState({ id: cid }, '', url.href);
|
||||
}
|
||||
}
|
||||
|
||||
function which(event: MouseEvent) {
|
||||
return event.which === null ? event.button : event.which;
|
||||
}
|
||||
|
||||
function find_anchor(node: Node) {
|
||||
while (node && node.nodeName.toUpperCase() !== 'A') node = node.parentNode; // SVG <a> elements have a lowercase name
|
||||
return node;
|
||||
}
|
||||
|
||||
function handle_popstate(event: PopStateEvent) {
|
||||
scroll_history[cid] = scroll_state();
|
||||
|
||||
if (event.state) {
|
||||
const url = new URL(location.href);
|
||||
const target = select_target(url);
|
||||
if (target) {
|
||||
navigate(target, event.state.id);
|
||||
} else {
|
||||
location.href = location.href;
|
||||
}
|
||||
} else {
|
||||
// hashchange
|
||||
set_uid(uid + 1);
|
||||
set_cid(uid);
|
||||
history.replaceState({ id: cid }, '', location.href);
|
||||
}
|
||||
}
|
||||
62
runtime/src/app/types.ts
Normal file
62
runtime/src/app/types.ts
Normal file
@@ -0,0 +1,62 @@
|
||||
export type Params = Record<string, string>;
|
||||
export type Query = Record<string, string | true>;
|
||||
export type RouteData = { params: Params, query: Query, path: string };
|
||||
|
||||
type Child = {
|
||||
segment?: string;
|
||||
props?: any;
|
||||
component?: Component;
|
||||
};
|
||||
|
||||
export interface ComponentConstructor {
|
||||
new (options: { target: Node, props: any, hydrate: boolean }): Component;
|
||||
preload: (props: { params: Params, query: Query }) => Promise<any>;
|
||||
};
|
||||
|
||||
export interface Component {
|
||||
$set: (data: any) => void;
|
||||
$destroy: () => void;
|
||||
}
|
||||
|
||||
export type ComponentLoader = {
|
||||
js: () => Promise<{ default: ComponentConstructor }>,
|
||||
css: string[]
|
||||
};
|
||||
|
||||
export type Route = {
|
||||
pattern: RegExp;
|
||||
parts: Array<{
|
||||
i: number;
|
||||
params?: (match: RegExpExecArray) => Record<string, string>;
|
||||
}>;
|
||||
};
|
||||
|
||||
export type Manifest = {
|
||||
ignore: RegExp[];
|
||||
root: ComponentConstructor;
|
||||
error: () => Promise<{ default: ComponentConstructor }>;
|
||||
pages: Route[]
|
||||
};
|
||||
|
||||
export type ScrollPosition = {
|
||||
x: number;
|
||||
y: number;
|
||||
};
|
||||
|
||||
export type Target = {
|
||||
href: string;
|
||||
route: Route;
|
||||
match: RegExpExecArray;
|
||||
page: Page;
|
||||
};
|
||||
|
||||
export type Redirect = {
|
||||
statusCode: number;
|
||||
location: string;
|
||||
};
|
||||
|
||||
export type Page = {
|
||||
path: string;
|
||||
params: Record<string, string>;
|
||||
query: Record<string, string | string[]>;
|
||||
};
|
||||
1
runtime/src/server/constants.js
Normal file
1
runtime/src/server/constants.js
Normal file
@@ -0,0 +1 @@
|
||||
export const IGNORE = '__SAPPER__IGNORE__';
|
||||
1
runtime/src/server/index.ts
Normal file
1
runtime/src/server/index.ts
Normal file
@@ -0,0 +1 @@
|
||||
export { default as middleware } from './middleware/index';
|
||||
365
runtime/src/server/middleware/get_page_handler.ts
Normal file
365
runtime/src/server/middleware/get_page_handler.ts
Normal file
@@ -0,0 +1,365 @@
|
||||
import { writable } from 'svelte/store.mjs';
|
||||
import fs from 'fs';
|
||||
import path from 'path';
|
||||
import cookie from 'cookie';
|
||||
import devalue from 'devalue';
|
||||
import fetch from 'node-fetch';
|
||||
import URL from 'url';
|
||||
import { IGNORE } from '../constants';
|
||||
import { Manifest, Page, Props, Req, Res } from './types';
|
||||
import { build_dir, dev, src_dir } from '@sapper/internal/manifest-server';
|
||||
import { stores } from '@sapper/internal/shared';
|
||||
import Sapper from '@sapper/internal/Sapper.html';
|
||||
|
||||
export function get_page_handler(
|
||||
manifest: Manifest,
|
||||
session_getter: (req: Req, res: Res) => any
|
||||
) {
|
||||
const get_build_info = dev
|
||||
? () => JSON.parse(fs.readFileSync(path.join(build_dir, 'build.json'), 'utf-8'))
|
||||
: (assets => () => assets)(JSON.parse(fs.readFileSync(path.join(build_dir, 'build.json'), 'utf-8')));
|
||||
|
||||
const template = dev
|
||||
? () => read_template(src_dir)
|
||||
: (str => () => str)(read_template(build_dir));
|
||||
|
||||
const has_service_worker = fs.existsSync(path.join(build_dir, 'service-worker.js'));
|
||||
|
||||
const { server_routes, pages } = manifest;
|
||||
const error_route = manifest.error;
|
||||
|
||||
function handle_error(req: Req, res: Res, statusCode: number, error: Error | string) {
|
||||
handle_page({
|
||||
pattern: null,
|
||||
parts: [
|
||||
{ name: null, component: error_route }
|
||||
]
|
||||
}, req, res, statusCode, error || new Error('Unknown error in preload function'));
|
||||
}
|
||||
|
||||
async function handle_page(page: Page, req: Req, res: Res, status = 200, error: Error | string = null) {
|
||||
const isSWIndexHtml = req.path === '/service-worker-index.html';
|
||||
const build_info: {
|
||||
bundler: 'rollup' | 'webpack',
|
||||
shimport: string | null,
|
||||
assets: Record<string, string | string[]>,
|
||||
legacy_assets?: Record<string, string>
|
||||
} = get_build_info();
|
||||
|
||||
res.setHeader('Content-Type', 'text/html');
|
||||
res.setHeader('Cache-Control', dev ? 'no-cache' : 'max-age=600');
|
||||
|
||||
// preload main.js and current route
|
||||
// TODO detect other stuff we can preload? images, CSS, fonts?
|
||||
let preloaded_chunks = Array.isArray(build_info.assets.main) ? build_info.assets.main : [build_info.assets.main];
|
||||
if (!error && !isSWIndexHtml) {
|
||||
page.parts.forEach(part => {
|
||||
if (!part) return;
|
||||
|
||||
// using concat because it could be a string or an array. thanks webpack!
|
||||
preloaded_chunks = preloaded_chunks.concat(build_info.assets[part.name]);
|
||||
});
|
||||
}
|
||||
|
||||
if (build_info.bundler === 'rollup') {
|
||||
// TODO add dependencies and CSS
|
||||
const link = preloaded_chunks
|
||||
.filter(file => file && !file.match(/\.map$/))
|
||||
.map(file => `<${req.baseUrl}/client/${file}>;rel="modulepreload"`)
|
||||
.join(', ');
|
||||
|
||||
res.setHeader('Link', link);
|
||||
} else {
|
||||
const link = preloaded_chunks
|
||||
.filter(file => file && !file.match(/\.map$/))
|
||||
.map((file) => {
|
||||
const as = /\.css$/.test(file) ? 'style' : 'script';
|
||||
return `<${req.baseUrl}/client/${file}>;rel="preload";as="${as}"`;
|
||||
})
|
||||
.join(', ');
|
||||
|
||||
res.setHeader('Link', link);
|
||||
}
|
||||
|
||||
const session = session_getter(req, res);
|
||||
|
||||
let redirect: { statusCode: number, location: string };
|
||||
let preload_error: { statusCode: number, message: Error | string };
|
||||
|
||||
const preload_context = {
|
||||
redirect: (statusCode: number, location: string) => {
|
||||
if (redirect && (redirect.statusCode !== statusCode || redirect.location !== location)) {
|
||||
throw new Error(`Conflicting redirects`);
|
||||
}
|
||||
location = location.replace(/^\//g, ''); // leading slash (only)
|
||||
redirect = { statusCode, location };
|
||||
},
|
||||
error: (statusCode: number, message: Error | string) => {
|
||||
preload_error = { statusCode, message };
|
||||
},
|
||||
fetch: (url: string, opts?: any) => {
|
||||
const parsed = new URL.URL(url, `http://127.0.0.1:${process.env.PORT}${req.baseUrl ? req.baseUrl + '/' :''}`);
|
||||
|
||||
if (opts) {
|
||||
opts = Object.assign({}, opts);
|
||||
|
||||
const include_cookies = (
|
||||
opts.credentials === 'include' ||
|
||||
opts.credentials === 'same-origin' && parsed.origin === `http://127.0.0.1:${process.env.PORT}`
|
||||
);
|
||||
|
||||
if (include_cookies) {
|
||||
opts.headers = Object.assign({}, opts.headers);
|
||||
|
||||
const cookies = Object.assign(
|
||||
{},
|
||||
cookie.parse(req.headers.cookie || ''),
|
||||
cookie.parse(opts.headers.cookie || '')
|
||||
);
|
||||
|
||||
const set_cookie = res.getHeader('Set-Cookie');
|
||||
(Array.isArray(set_cookie) ? set_cookie : [set_cookie]).forEach(str => {
|
||||
const match = /([^=]+)=([^;]+)/.exec(<string>str);
|
||||
if (match) cookies[match[1]] = match[2];
|
||||
});
|
||||
|
||||
const str = Object.keys(cookies)
|
||||
.map(key => `${key}=${cookies[key]}`)
|
||||
.join('; ');
|
||||
|
||||
opts.headers.cookie = str;
|
||||
}
|
||||
}
|
||||
|
||||
return fetch(parsed.href, opts);
|
||||
}
|
||||
};
|
||||
|
||||
let preloaded;
|
||||
let match;
|
||||
let params;
|
||||
|
||||
try {
|
||||
const root_preloaded = manifest.root_preload
|
||||
? manifest.root_preload.call(preload_context, {
|
||||
path: req.path,
|
||||
query: req.query,
|
||||
params: {}
|
||||
})
|
||||
: {};
|
||||
|
||||
match = error ? null : page.pattern.exec(req.path);
|
||||
|
||||
|
||||
let toPreload = [root_preloaded];
|
||||
if (!isSWIndexHtml) {
|
||||
toPreload = toPreload.concat(page.parts.map(part => {
|
||||
if (!part) return null;
|
||||
|
||||
// the deepest level is used below, to initialise the store
|
||||
params = part.params ? part.params(match) : {};
|
||||
|
||||
return part.preload
|
||||
? part.preload.call(preload_context, {
|
||||
path: req.path,
|
||||
query: req.query,
|
||||
params
|
||||
}, session)
|
||||
: {};
|
||||
}))
|
||||
}
|
||||
|
||||
preloaded = await Promise.all(toPreload);
|
||||
} catch (err) {
|
||||
preload_error = { statusCode: 500, message: err };
|
||||
preloaded = []; // appease TypeScript
|
||||
}
|
||||
|
||||
try {
|
||||
if (redirect) {
|
||||
const location = URL.resolve(req.baseUrl || '/', redirect.location);
|
||||
|
||||
res.statusCode = redirect.statusCode;
|
||||
res.setHeader('Location', location);
|
||||
res.end();
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
if (preload_error) {
|
||||
handle_error(req, res, preload_error.statusCode, preload_error.message);
|
||||
return;
|
||||
}
|
||||
|
||||
const segments = req.path.split('/').filter(Boolean);
|
||||
|
||||
const props = Object.assign({}, preloaded[0], {
|
||||
child: {
|
||||
segment: segments[0],
|
||||
props: {}
|
||||
}
|
||||
});
|
||||
|
||||
let level = props.child;
|
||||
if (!isSWIndexHtml) {
|
||||
for (let i = 0; i < page.parts.length; i += 1) {
|
||||
const part = page.parts[i];
|
||||
if (!part) continue;
|
||||
|
||||
Object.assign(level, {
|
||||
component: part.component,
|
||||
props: Object.assign({}, preloaded[i + 1])
|
||||
});
|
||||
|
||||
level.props.child = <Props["child"]>{
|
||||
segment: segments[i + 1],
|
||||
props: {}
|
||||
};
|
||||
level = level.props.child;
|
||||
}
|
||||
}
|
||||
|
||||
if (error) {
|
||||
props.child.props.error = error instanceof Error ? error : { message: error };
|
||||
props.child.props.status = status;
|
||||
}
|
||||
|
||||
stores.page.set({
|
||||
path: req.path,
|
||||
query: req.query,
|
||||
params: params
|
||||
});
|
||||
|
||||
const { html, head, css } = Sapper.render({
|
||||
Root: manifest.root,
|
||||
props: props,
|
||||
session: writable(session)
|
||||
});
|
||||
|
||||
const serialized = {
|
||||
preloaded: `[${preloaded.map(data => try_serialize(data)).join(',')}]`,
|
||||
session: session && try_serialize(session, err => {
|
||||
throw new Error(`Failed to serialize session data: ${err.message}`);
|
||||
})
|
||||
};
|
||||
|
||||
let script = `__SAPPER__={${[
|
||||
error && `error:1`,
|
||||
`baseUrl:"${req.baseUrl}"`,
|
||||
serialized.preloaded && `preloaded:${serialized.preloaded}`,
|
||||
serialized.session && `session:${serialized.session}`
|
||||
].filter(Boolean).join(',')}};`;
|
||||
|
||||
if (has_service_worker) {
|
||||
script += `if('serviceWorker' in navigator)navigator.serviceWorker.register('${req.baseUrl}/service-worker.js');`;
|
||||
}
|
||||
|
||||
const file = [].concat(build_info.assets.main).filter(file => file && /\.js$/.test(file))[0];
|
||||
const main = `${req.baseUrl}/client/${file}`;
|
||||
|
||||
if (build_info.bundler === 'rollup') {
|
||||
if (build_info.legacy_assets) {
|
||||
const legacy_main = `${req.baseUrl}/client/legacy/${build_info.legacy_assets.main}`;
|
||||
script += `(function(){try{eval("async function x(){}");var main="${main}"}catch(e){main="${legacy_main}"};var s=document.createElement("script");try{new Function("if(0)import('')")();s.src=main;s.type="module";s.crossOrigin="use-credentials";}catch(e){s.src="${req.baseUrl}/client/shimport@${build_info.shimport}.js";s.setAttribute("data-main",main);}document.head.appendChild(s);}());`;
|
||||
} else {
|
||||
script += `var s=document.createElement("script");try{new Function("if(0)import('')")();s.src="${main}";s.type="module";s.crossOrigin="use-credentials";}catch(e){s.src="${req.baseUrl}/client/shimport@${build_info.shimport}.js";s.setAttribute("data-main","${main}")}document.head.appendChild(s)`;
|
||||
}
|
||||
} else {
|
||||
script += `</script><script src="${main}">`;
|
||||
}
|
||||
|
||||
let styles: string;
|
||||
|
||||
// TODO make this consistent across apps
|
||||
// TODO embed build_info in placeholder.ts
|
||||
if (build_info.css && build_info.css.main) {
|
||||
const css_chunks = new Set();
|
||||
if (build_info.css.main) css_chunks.add(build_info.css.main);
|
||||
page.parts.forEach(part => {
|
||||
if (!part) return;
|
||||
const css_chunks_for_part = build_info.css.chunks[part.file];
|
||||
|
||||
if (css_chunks_for_part) {
|
||||
css_chunks_for_part.forEach(file => {
|
||||
css_chunks.add(file);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
styles = Array.from(css_chunks)
|
||||
.map(href => `<link rel="stylesheet" href="client/${href}">`)
|
||||
.join('')
|
||||
} else {
|
||||
styles = (css && css.code ? `<style>${css.code}</style>` : '');
|
||||
}
|
||||
|
||||
// users can set a CSP nonce using res.locals.nonce
|
||||
const nonce_attr = (res.locals && res.locals.nonce) ? ` nonce="${res.locals.nonce}"` : '';
|
||||
|
||||
const body = template()
|
||||
.replace('%sapper.base%', () => `<base href="${req.baseUrl}/">`)
|
||||
.replace('%sapper.scripts%', () => `<script${nonce_attr}>${script}</script>`)
|
||||
.replace('%sapper.html%', () => html)
|
||||
.replace('%sapper.head%', () => `<noscript id='sapper-head-start'></noscript>${head}<noscript id='sapper-head-end'></noscript>`)
|
||||
.replace('%sapper.styles%', () => styles);
|
||||
|
||||
res.statusCode = status;
|
||||
res.end(body);
|
||||
} catch(err) {
|
||||
console.log(err);
|
||||
if (error) {
|
||||
// we encountered an error while rendering the error page — oops
|
||||
res.statusCode = 500;
|
||||
res.end(`<pre>${escape_html(err.message)}</pre>`);
|
||||
} else {
|
||||
handle_error(req, res, 500, err);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return function find_route(req: Req, res: Res, next: () => void) {
|
||||
if (req[IGNORE]) return next();
|
||||
|
||||
if (req.path === '/service-worker-index.html') {
|
||||
const homePage = pages.find(page => page.pattern.test('/'));
|
||||
handle_page(homePage, req, res);
|
||||
return;
|
||||
}
|
||||
|
||||
if (!server_routes.some(route => route.pattern.test(req.path))) {
|
||||
for (const page of pages) {
|
||||
if (page.pattern.test(req.path)) {
|
||||
handle_page(page, req, res);
|
||||
return;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
handle_error(req, res, 404, 'Not found');
|
||||
};
|
||||
}
|
||||
|
||||
function read_template(dir = build_dir) {
|
||||
return fs.readFileSync(`${dir}/template.html`, 'utf-8');
|
||||
}
|
||||
|
||||
function try_serialize(data: any, fail?: (err) => void) {
|
||||
try {
|
||||
return devalue(data);
|
||||
} catch (err) {
|
||||
if (fail) fail(err);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
function escape_html(html: string) {
|
||||
const chars: Record<string, string> = {
|
||||
'"' : 'quot',
|
||||
"'": '#39',
|
||||
'&': 'amp',
|
||||
'<' : 'lt',
|
||||
'>' : 'gt'
|
||||
};
|
||||
|
||||
return html.replace(/["'&<>]/g, c => `&${chars[c]};`);
|
||||
}
|
||||
78
runtime/src/server/middleware/get_server_route_handler.ts
Normal file
78
runtime/src/server/middleware/get_server_route_handler.ts
Normal file
@@ -0,0 +1,78 @@
|
||||
import { IGNORE } from '../constants';
|
||||
import { Req, Res, ServerRoute } from './types';
|
||||
|
||||
export function get_server_route_handler(routes: ServerRoute[]) {
|
||||
async function handle_route(route: ServerRoute, req: Req, res: Res, next: () => void) {
|
||||
req.params = route.params(route.pattern.exec(req.path));
|
||||
|
||||
const method = req.method.toLowerCase();
|
||||
// 'delete' cannot be exported from a module because it is a keyword,
|
||||
// so check for 'del' instead
|
||||
const method_export = method === 'delete' ? 'del' : method;
|
||||
const handle_method = route.handlers[method_export];
|
||||
if (handle_method) {
|
||||
if (process.env.SAPPER_EXPORT) {
|
||||
const { write, end, setHeader } = res;
|
||||
const chunks: any[] = [];
|
||||
const headers: Record<string, string> = {};
|
||||
|
||||
// intercept data so that it can be exported
|
||||
res.write = function(chunk: any) {
|
||||
chunks.push(Buffer.from(chunk));
|
||||
write.apply(res, arguments);
|
||||
};
|
||||
|
||||
res.setHeader = function(name: string, value: string) {
|
||||
headers[name.toLowerCase()] = value;
|
||||
setHeader.apply(res, arguments);
|
||||
};
|
||||
|
||||
res.end = function(chunk?: any) {
|
||||
if (chunk) chunks.push(Buffer.from(chunk));
|
||||
end.apply(res, arguments);
|
||||
|
||||
process.send({
|
||||
__sapper__: true,
|
||||
event: 'file',
|
||||
url: req.url,
|
||||
method: req.method,
|
||||
status: res.statusCode,
|
||||
type: headers['content-type'],
|
||||
body: Buffer.concat(chunks).toString()
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
const handle_next = (err?: Error) => {
|
||||
if (err) {
|
||||
res.statusCode = 500;
|
||||
res.end(err.message);
|
||||
} else {
|
||||
process.nextTick(next);
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
await handle_method(req, res, handle_next);
|
||||
} catch (err) {
|
||||
handle_next(err);
|
||||
}
|
||||
} else {
|
||||
// no matching handler for method
|
||||
process.nextTick(next);
|
||||
}
|
||||
}
|
||||
|
||||
return function find_route(req: Req, res: Res, next: () => void) {
|
||||
if (req[IGNORE]) return next();
|
||||
|
||||
for (const route of routes) {
|
||||
if (route.pattern.test(req.path)) {
|
||||
handle_route(route, req, res, next);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
next();
|
||||
};
|
||||
}
|
||||
146
runtime/src/server/middleware/index.ts
Normal file
146
runtime/src/server/middleware/index.ts
Normal file
@@ -0,0 +1,146 @@
|
||||
import fs from 'fs';
|
||||
import path from 'path';
|
||||
import { build_dir, dev, manifest } from '@sapper/internal/manifest-server';
|
||||
import { Handler, Req, Res } from './types';
|
||||
import { get_server_route_handler } from './get_server_route_handler';
|
||||
import { get_page_handler } from './get_page_handler';
|
||||
import { lookup } from './mime';
|
||||
import { IGNORE } from '../constants';
|
||||
|
||||
export default function middleware(opts: {
|
||||
session?: (req: Req, res: Res) => any,
|
||||
ignore?: any
|
||||
} = {}) {
|
||||
const { session, ignore } = opts;
|
||||
|
||||
let emitted_basepath = false;
|
||||
|
||||
return compose_handlers([
|
||||
ignore && ((req: Req, res: Res, next: () => void) => {
|
||||
req[IGNORE] = should_ignore(req.path, ignore);
|
||||
next();
|
||||
}),
|
||||
|
||||
(req: Req, res: Res, next: () => void) => {
|
||||
if (req[IGNORE]) return next();
|
||||
|
||||
if (req.baseUrl === undefined) {
|
||||
let { originalUrl } = req;
|
||||
if (req.url === '/' && originalUrl[originalUrl.length - 1] !== '/') {
|
||||
originalUrl += '/';
|
||||
}
|
||||
|
||||
req.baseUrl = originalUrl
|
||||
? originalUrl.slice(0, -req.url.length)
|
||||
: '';
|
||||
}
|
||||
|
||||
if (!emitted_basepath && process.send) {
|
||||
process.send({
|
||||
__sapper__: true,
|
||||
event: 'basepath',
|
||||
basepath: req.baseUrl
|
||||
});
|
||||
|
||||
emitted_basepath = true;
|
||||
}
|
||||
|
||||
if (req.path === undefined) {
|
||||
req.path = req.url.replace(/\?.*/, '');
|
||||
}
|
||||
|
||||
next();
|
||||
},
|
||||
|
||||
fs.existsSync(path.join(build_dir, 'index.html')) && serve({
|
||||
pathname: '/index.html',
|
||||
cache_control: dev ? 'no-cache' : 'max-age=600'
|
||||
}),
|
||||
|
||||
fs.existsSync(path.join(build_dir, 'service-worker.js')) && serve({
|
||||
pathname: '/service-worker.js',
|
||||
cache_control: 'no-cache, no-store, must-revalidate'
|
||||
}),
|
||||
|
||||
fs.existsSync(path.join(build_dir, 'service-worker.js.map')) && serve({
|
||||
pathname: '/service-worker.js.map',
|
||||
cache_control: 'no-cache, no-store, must-revalidate'
|
||||
}),
|
||||
|
||||
serve({
|
||||
prefix: '/client/',
|
||||
cache_control: dev ? 'no-cache' : 'max-age=31536000, immutable'
|
||||
}),
|
||||
|
||||
get_server_route_handler(manifest.server_routes),
|
||||
|
||||
get_page_handler(manifest, session || noop)
|
||||
].filter(Boolean));
|
||||
}
|
||||
|
||||
export function compose_handlers(handlers: Handler[]) {
|
||||
return (req: Req, res: Res, next: () => void) => {
|
||||
let i = 0;
|
||||
function go() {
|
||||
const handler = handlers[i];
|
||||
|
||||
if (handler) {
|
||||
handler(req, res, () => {
|
||||
i += 1;
|
||||
go();
|
||||
});
|
||||
} else {
|
||||
next();
|
||||
}
|
||||
}
|
||||
|
||||
go();
|
||||
};
|
||||
}
|
||||
|
||||
export function should_ignore(uri: string, val: any) {
|
||||
if (Array.isArray(val)) return val.some(x => should_ignore(uri, x));
|
||||
if (val instanceof RegExp) return val.test(uri);
|
||||
if (typeof val === 'function') return val(uri);
|
||||
return uri.startsWith(val.charCodeAt(0) === 47 ? val : `/${val}`);
|
||||
}
|
||||
|
||||
export function serve({ prefix, pathname, cache_control }: {
|
||||
prefix?: string,
|
||||
pathname?: string,
|
||||
cache_control: string
|
||||
}) {
|
||||
const filter = pathname
|
||||
? (req: Req) => req.path === pathname
|
||||
: (req: Req) => req.path.startsWith(prefix);
|
||||
|
||||
const cache: Map<string, Buffer> = new Map();
|
||||
|
||||
const read = dev
|
||||
? (file: string) => fs.readFileSync(path.resolve(build_dir, file))
|
||||
: (file: string) => (cache.has(file) ? cache : cache.set(file, fs.readFileSync(path.resolve(build_dir, file)))).get(file)
|
||||
|
||||
return (req: Req, res: Res, next: () => void) => {
|
||||
if (req[IGNORE]) return next();
|
||||
|
||||
if (filter(req)) {
|
||||
const type = lookup(req.path);
|
||||
|
||||
try {
|
||||
const file = decodeURIComponent(req.path.slice(1));
|
||||
const data = read(file);
|
||||
|
||||
res.setHeader('Content-Type', type);
|
||||
res.setHeader('Cache-Control', cache_control);
|
||||
res.end(data);
|
||||
} catch (err) {
|
||||
res.statusCode = 404;
|
||||
res.end('not found');
|
||||
}
|
||||
} else {
|
||||
next();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function noop(){}
|
||||
767
runtime/src/server/middleware/mime-types.md
Normal file
767
runtime/src/server/middleware/mime-types.md
Normal file
@@ -0,0 +1,767 @@
|
||||
application/andrew-inset ez
|
||||
application/applixware aw
|
||||
application/atom+xml atom
|
||||
application/atomcat+xml atomcat
|
||||
application/atomsvc+xml atomsvc
|
||||
application/ccxml+xml ccxml
|
||||
application/cdmi-capability cdmia
|
||||
application/cdmi-container cdmic
|
||||
application/cdmi-domain cdmid
|
||||
application/cdmi-object cdmio
|
||||
application/cdmi-queue cdmiq
|
||||
application/cu-seeme cu
|
||||
application/davmount+xml davmount
|
||||
application/docbook+xml dbk
|
||||
application/dssc+der dssc
|
||||
application/dssc+xml xdssc
|
||||
application/ecmascript ecma
|
||||
application/emma+xml emma
|
||||
application/epub+zip epub
|
||||
application/exi exi
|
||||
application/font-tdpfr pfr
|
||||
application/gml+xml gml
|
||||
application/gpx+xml gpx
|
||||
application/gxf gxf
|
||||
application/hyperstudio stk
|
||||
application/inkml+xml ink inkml
|
||||
application/ipfix ipfix
|
||||
application/java-archive jar
|
||||
application/java-serialized-object ser
|
||||
application/java-vm class
|
||||
application/javascript js
|
||||
application/json json map
|
||||
application/jsonml+json jsonml
|
||||
application/lost+xml lostxml
|
||||
application/mac-binhex40 hqx
|
||||
application/mac-compactpro cpt
|
||||
application/mads+xml mads
|
||||
application/marc mrc
|
||||
application/marcxml+xml mrcx
|
||||
application/mathematica ma nb mb
|
||||
application/mathml+xml mathml
|
||||
application/mbox mbox
|
||||
application/mediaservercontrol+xml mscml
|
||||
application/metalink+xml metalink
|
||||
application/metalink4+xml meta4
|
||||
application/mets+xml mets
|
||||
application/mods+xml mods
|
||||
application/mp21 m21 mp21
|
||||
application/mp4 mp4s
|
||||
application/msword doc dot
|
||||
application/mxf mxf
|
||||
application/octet-stream bin dms lrf mar so dist distz pkg bpk dump elc deploy
|
||||
application/oda oda
|
||||
application/oebps-package+xml opf
|
||||
application/ogg ogx
|
||||
application/omdoc+xml omdoc
|
||||
application/onenote onetoc onetoc2 onetmp onepkg
|
||||
application/oxps oxps
|
||||
application/patch-ops-error+xml xer
|
||||
application/pdf pdf
|
||||
application/pgp-encrypted pgp
|
||||
application/pgp-signature asc sig
|
||||
application/pics-rules prf
|
||||
application/pkcs10 p10
|
||||
application/pkcs7-mime p7m p7c
|
||||
application/pkcs7-signature p7s
|
||||
application/pkcs8 p8
|
||||
application/pkix-attr-cert ac
|
||||
application/pkix-cert cer
|
||||
application/pkix-crl crl
|
||||
application/pkix-pkipath pkipath
|
||||
application/pkixcmp pki
|
||||
application/pls+xml pls
|
||||
application/postscript ai eps ps
|
||||
application/prs.cww cww
|
||||
application/pskc+xml pskcxml
|
||||
application/rdf+xml rdf
|
||||
application/reginfo+xml rif
|
||||
application/relax-ng-compact-syntax rnc
|
||||
application/resource-lists+xml rl
|
||||
application/resource-lists-diff+xml rld
|
||||
application/rls-services+xml rs
|
||||
application/rpki-ghostbusters gbr
|
||||
application/rpki-manifest mft
|
||||
application/rpki-roa roa
|
||||
application/rsd+xml rsd
|
||||
application/rss+xml rss
|
||||
application/rtf rtf
|
||||
application/sbml+xml sbml
|
||||
application/scvp-cv-request scq
|
||||
application/scvp-cv-response scs
|
||||
application/scvp-vp-request spq
|
||||
application/scvp-vp-response spp
|
||||
application/sdp sdp
|
||||
application/set-payment-initiation setpay
|
||||
application/set-registration-initiation setreg
|
||||
application/shf+xml shf
|
||||
application/smil+xml smi smil
|
||||
application/sparql-query rq
|
||||
application/sparql-results+xml srx
|
||||
application/srgs gram
|
||||
application/srgs+xml grxml
|
||||
application/sru+xml sru
|
||||
application/ssdl+xml ssdl
|
||||
application/ssml+xml ssml
|
||||
application/tei+xml tei teicorpus
|
||||
application/thraud+xml tfi
|
||||
application/timestamped-data tsd
|
||||
application/vnd.3gpp.pic-bw-large plb
|
||||
application/vnd.3gpp.pic-bw-small psb
|
||||
application/vnd.3gpp.pic-bw-var pvb
|
||||
application/vnd.3gpp2.tcap tcap
|
||||
application/vnd.3m.post-it-notes pwn
|
||||
application/vnd.accpac.simply.aso aso
|
||||
application/vnd.accpac.simply.imp imp
|
||||
application/vnd.acucobol acu
|
||||
application/vnd.acucorp atc acutc
|
||||
application/vnd.adobe.air-application-installer-package+zip air
|
||||
application/vnd.adobe.formscentral.fcdt fcdt
|
||||
application/vnd.adobe.fxp fxp fxpl
|
||||
application/vnd.adobe.xdp+xml xdp
|
||||
application/vnd.adobe.xfdf xfdf
|
||||
application/vnd.ahead.space ahead
|
||||
application/vnd.airzip.filesecure.azf azf
|
||||
application/vnd.airzip.filesecure.azs azs
|
||||
application/vnd.amazon.ebook azw
|
||||
application/vnd.americandynamics.acc acc
|
||||
application/vnd.amiga.ami ami
|
||||
application/vnd.android.package-archive apk
|
||||
application/vnd.anser-web-certificate-issue-initiation cii
|
||||
application/vnd.anser-web-funds-transfer-initiation fti
|
||||
application/vnd.antix.game-component atx
|
||||
application/vnd.apple.installer+xml mpkg
|
||||
application/vnd.apple.mpegurl m3u8
|
||||
application/vnd.aristanetworks.swi swi
|
||||
application/vnd.astraea-software.iota iota
|
||||
application/vnd.audiograph aep
|
||||
application/vnd.blueice.multipass mpm
|
||||
application/vnd.bmi bmi
|
||||
application/vnd.businessobjects rep
|
||||
application/vnd.chemdraw+xml cdxml
|
||||
application/vnd.chipnuts.karaoke-mmd mmd
|
||||
application/vnd.cinderella cdy
|
||||
application/vnd.claymore cla
|
||||
application/vnd.cloanto.rp9 rp9
|
||||
application/vnd.clonk.c4group c4g c4d c4f c4p c4u
|
||||
application/vnd.cluetrust.cartomobile-config c11amc
|
||||
application/vnd.cluetrust.cartomobile-config-pkg c11amz
|
||||
application/vnd.commonspace csp
|
||||
application/vnd.contact.cmsg cdbcmsg
|
||||
application/vnd.cosmocaller cmc
|
||||
application/vnd.crick.clicker clkx
|
||||
application/vnd.crick.clicker.keyboard clkk
|
||||
application/vnd.crick.clicker.palette clkp
|
||||
application/vnd.crick.clicker.template clkt
|
||||
application/vnd.crick.clicker.wordbank clkw
|
||||
application/vnd.criticaltools.wbs+xml wbs
|
||||
application/vnd.ctc-posml pml
|
||||
application/vnd.cups-ppd ppd
|
||||
application/vnd.curl.car car
|
||||
application/vnd.curl.pcurl pcurl
|
||||
application/vnd.dart dart
|
||||
application/vnd.data-vision.rdz rdz
|
||||
application/vnd.dece.data uvf uvvf uvd uvvd
|
||||
application/vnd.dece.ttml+xml uvt uvvt
|
||||
application/vnd.dece.unspecified uvx uvvx
|
||||
application/vnd.dece.zip uvz uvvz
|
||||
application/vnd.denovo.fcselayout-link fe_launch
|
||||
application/vnd.dna dna
|
||||
application/vnd.dolby.mlp mlp
|
||||
application/vnd.dpgraph dpg
|
||||
application/vnd.dreamfactory dfac
|
||||
application/vnd.ds-keypoint kpxx
|
||||
application/vnd.dvb.ait ait
|
||||
application/vnd.dvb.service svc
|
||||
application/vnd.dynageo geo
|
||||
application/vnd.ecowin.chart mag
|
||||
application/vnd.enliven nml
|
||||
application/vnd.epson.esf esf
|
||||
application/vnd.epson.msf msf
|
||||
application/vnd.epson.quickanime qam
|
||||
application/vnd.epson.salt slt
|
||||
application/vnd.epson.ssf ssf
|
||||
application/vnd.eszigno3+xml es3 et3
|
||||
application/vnd.ezpix-album ez2
|
||||
application/vnd.ezpix-package ez3
|
||||
application/vnd.fdf fdf
|
||||
application/vnd.fdsn.mseed mseed
|
||||
application/vnd.fdsn.seed seed dataless
|
||||
application/vnd.flographit gph
|
||||
application/vnd.fluxtime.clip ftc
|
||||
application/vnd.framemaker fm frame maker book
|
||||
application/vnd.frogans.fnc fnc
|
||||
application/vnd.frogans.ltf ltf
|
||||
application/vnd.fsc.weblaunch fsc
|
||||
application/vnd.fujitsu.oasys oas
|
||||
application/vnd.fujitsu.oasys2 oa2
|
||||
application/vnd.fujitsu.oasys3 oa3
|
||||
application/vnd.fujitsu.oasysgp fg5
|
||||
application/vnd.fujitsu.oasysprs bh2
|
||||
application/vnd.fujixerox.ddd ddd
|
||||
application/vnd.fujixerox.docuworks xdw
|
||||
application/vnd.fujixerox.docuworks.binder xbd
|
||||
application/vnd.fuzzysheet fzs
|
||||
application/vnd.genomatix.tuxedo txd
|
||||
application/vnd.geogebra.file ggb
|
||||
application/vnd.geogebra.tool ggt
|
||||
application/vnd.geometry-explorer gex gre
|
||||
application/vnd.geonext gxt
|
||||
application/vnd.geoplan g2w
|
||||
application/vnd.geospace g3w
|
||||
application/vnd.gmx gmx
|
||||
application/vnd.google-earth.kml+xml kml
|
||||
application/vnd.google-earth.kmz kmz
|
||||
application/vnd.grafeq gqf gqs
|
||||
application/vnd.groove-account gac
|
||||
application/vnd.groove-help ghf
|
||||
application/vnd.groove-identity-message gim
|
||||
application/vnd.groove-injector grv
|
||||
application/vnd.groove-tool-message gtm
|
||||
application/vnd.groove-tool-template tpl
|
||||
application/vnd.groove-vcard vcg
|
||||
application/vnd.hal+xml hal
|
||||
application/vnd.handheld-entertainment+xml zmm
|
||||
application/vnd.hbci hbci
|
||||
application/vnd.hhe.lesson-player les
|
||||
application/vnd.hp-hpgl hpgl
|
||||
application/vnd.hp-hpid hpid
|
||||
application/vnd.hp-hps hps
|
||||
application/vnd.hp-jlyt jlt
|
||||
application/vnd.hp-pcl pcl
|
||||
application/vnd.hp-pclxl pclxl
|
||||
application/vnd.hydrostatix.sof-data sfd-hdstx
|
||||
application/vnd.ibm.minipay mpy
|
||||
application/vnd.ibm.modcap afp listafp list3820
|
||||
application/vnd.ibm.rights-management irm
|
||||
application/vnd.ibm.secure-container sc
|
||||
application/vnd.iccprofile icc icm
|
||||
application/vnd.igloader igl
|
||||
application/vnd.immervision-ivp ivp
|
||||
application/vnd.immervision-ivu ivu
|
||||
application/vnd.insors.igm igm
|
||||
application/vnd.intercon.formnet xpw xpx
|
||||
application/vnd.intergeo i2g
|
||||
application/vnd.intu.qbo qbo
|
||||
application/vnd.intu.qfx qfx
|
||||
application/vnd.ipunplugged.rcprofile rcprofile
|
||||
application/vnd.irepository.package+xml irp
|
||||
application/vnd.is-xpr xpr
|
||||
application/vnd.isac.fcs fcs
|
||||
application/vnd.jam jam
|
||||
application/vnd.jcp.javame.midlet-rms rms
|
||||
application/vnd.jisp jisp
|
||||
application/vnd.joost.joda-archive joda
|
||||
application/vnd.kahootz ktz ktr
|
||||
application/vnd.kde.karbon karbon
|
||||
application/vnd.kde.kchart chrt
|
||||
application/vnd.kde.kformula kfo
|
||||
application/vnd.kde.kivio flw
|
||||
application/vnd.kde.kontour kon
|
||||
application/vnd.kde.kpresenter kpr kpt
|
||||
application/vnd.kde.kspread ksp
|
||||
application/vnd.kde.kword kwd kwt
|
||||
application/vnd.kenameaapp htke
|
||||
application/vnd.kidspiration kia
|
||||
application/vnd.kinar kne knp
|
||||
application/vnd.koan skp skd skt skm
|
||||
application/vnd.kodak-descriptor sse
|
||||
application/vnd.las.las+xml lasxml
|
||||
application/vnd.llamagraphics.life-balance.desktop lbd
|
||||
application/vnd.llamagraphics.life-balance.exchange+xml lbe
|
||||
application/vnd.lotus-1-2-3 123
|
||||
application/vnd.lotus-approach apr
|
||||
application/vnd.lotus-freelance pre
|
||||
application/vnd.lotus-notes nsf
|
||||
application/vnd.lotus-organizer org
|
||||
application/vnd.lotus-screencam scm
|
||||
application/vnd.lotus-wordpro lwp
|
||||
application/vnd.macports.portpkg portpkg
|
||||
application/vnd.mcd mcd
|
||||
application/vnd.medcalcdata mc1
|
||||
application/vnd.mediastation.cdkey cdkey
|
||||
application/vnd.mfer mwf
|
||||
application/vnd.mfmp mfm
|
||||
application/vnd.micrografx.flo flo
|
||||
application/vnd.micrografx.igx igx
|
||||
application/vnd.mif mif
|
||||
application/vnd.mobius.daf daf
|
||||
application/vnd.mobius.dis dis
|
||||
application/vnd.mobius.mbk mbk
|
||||
application/vnd.mobius.mqy mqy
|
||||
application/vnd.mobius.msl msl
|
||||
application/vnd.mobius.plc plc
|
||||
application/vnd.mobius.txf txf
|
||||
application/vnd.mophun.application mpn
|
||||
application/vnd.mophun.certificate mpc
|
||||
application/vnd.mozilla.xul+xml xul
|
||||
application/vnd.ms-artgalry cil
|
||||
application/vnd.ms-cab-compressed cab
|
||||
application/vnd.ms-excel xls xlm xla xlc xlt xlw
|
||||
application/vnd.ms-excel.addin.macroenabled.12 xlam
|
||||
application/vnd.ms-excel.sheet.binary.macroenabled.12 xlsb
|
||||
application/vnd.ms-excel.sheet.macroenabled.12 xlsm
|
||||
application/vnd.ms-excel.template.macroenabled.12 xltm
|
||||
application/vnd.ms-fontobject eot
|
||||
application/vnd.ms-htmlhelp chm
|
||||
application/vnd.ms-ims ims
|
||||
application/vnd.ms-lrm lrm
|
||||
application/vnd.ms-officetheme thmx
|
||||
application/vnd.ms-pki.seccat cat
|
||||
application/vnd.ms-pki.stl stl
|
||||
application/vnd.ms-powerpoint ppt pps pot
|
||||
application/vnd.ms-powerpoint.addin.macroenabled.12 ppam
|
||||
application/vnd.ms-powerpoint.presentation.macroenabled.12 pptm
|
||||
application/vnd.ms-powerpoint.slide.macroenabled.12 sldm
|
||||
application/vnd.ms-powerpoint.slideshow.macroenabled.12 ppsm
|
||||
application/vnd.ms-powerpoint.template.macroenabled.12 potm
|
||||
application/vnd.ms-project mpp mpt
|
||||
application/vnd.ms-word.document.macroenabled.12 docm
|
||||
application/vnd.ms-word.template.macroenabled.12 dotm
|
||||
application/vnd.ms-works wps wks wcm wdb
|
||||
application/vnd.ms-wpl wpl
|
||||
application/vnd.ms-xpsdocument xps
|
||||
application/vnd.mseq mseq
|
||||
application/vnd.musician mus
|
||||
application/vnd.muvee.style msty
|
||||
application/vnd.mynfc taglet
|
||||
application/vnd.neurolanguage.nlu nlu
|
||||
application/vnd.nitf ntf nitf
|
||||
application/vnd.noblenet-directory nnd
|
||||
application/vnd.noblenet-sealer nns
|
||||
application/vnd.noblenet-web nnw
|
||||
application/vnd.nokia.n-gage.data ngdat
|
||||
application/vnd.nokia.n-gage.symbian.install n-gage
|
||||
application/vnd.nokia.radio-preset rpst
|
||||
application/vnd.nokia.radio-presets rpss
|
||||
application/vnd.novadigm.edm edm
|
||||
application/vnd.novadigm.edx edx
|
||||
application/vnd.novadigm.ext ext
|
||||
application/vnd.oasis.opendocument.chart odc
|
||||
application/vnd.oasis.opendocument.chart-template otc
|
||||
application/vnd.oasis.opendocument.database odb
|
||||
application/vnd.oasis.opendocument.formula odf
|
||||
application/vnd.oasis.opendocument.formula-template odft
|
||||
application/vnd.oasis.opendocument.graphics odg
|
||||
application/vnd.oasis.opendocument.graphics-template otg
|
||||
application/vnd.oasis.opendocument.image odi
|
||||
application/vnd.oasis.opendocument.image-template oti
|
||||
application/vnd.oasis.opendocument.presentation odp
|
||||
application/vnd.oasis.opendocument.presentation-template otp
|
||||
application/vnd.oasis.opendocument.spreadsheet ods
|
||||
application/vnd.oasis.opendocument.spreadsheet-template ots
|
||||
application/vnd.oasis.opendocument.text odt
|
||||
application/vnd.oasis.opendocument.text-master odm
|
||||
application/vnd.oasis.opendocument.text-template ott
|
||||
application/vnd.oasis.opendocument.text-web oth
|
||||
application/vnd.olpc-sugar xo
|
||||
application/vnd.oma.dd2+xml dd2
|
||||
application/vnd.openofficeorg.extension oxt
|
||||
application/vnd.openxmlformats-officedocument.presentationml.presentation pptx
|
||||
application/vnd.openxmlformats-officedocument.presentationml.slide sldx
|
||||
application/vnd.openxmlformats-officedocument.presentationml.slideshow ppsx
|
||||
application/vnd.openxmlformats-officedocument.presentationml.template potx
|
||||
application/vnd.openxmlformats-officedocument.spreadsheetml.sheet xlsx
|
||||
application/vnd.openxmlformats-officedocument.spreadsheetml.template xltx
|
||||
application/vnd.openxmlformats-officedocument.wordprocessingml.document docx
|
||||
application/vnd.openxmlformats-officedocument.wordprocessingml.template dotx
|
||||
application/vnd.osgeo.mapguide.package mgp
|
||||
application/vnd.osgi.dp dp
|
||||
application/vnd.osgi.subsystem esa
|
||||
application/vnd.palm pdb pqa oprc
|
||||
application/vnd.pawaafile paw
|
||||
application/vnd.pg.format str
|
||||
application/vnd.pg.osasli ei6
|
||||
application/vnd.picsel efif
|
||||
application/vnd.pmi.widget wg
|
||||
application/vnd.pocketlearn plf
|
||||
application/vnd.powerbuilder6 pbd
|
||||
application/vnd.previewsystems.box box
|
||||
application/vnd.proteus.magazine mgz
|
||||
application/vnd.publishare-delta-tree qps
|
||||
application/vnd.pvi.ptid1 ptid
|
||||
application/vnd.quark.quarkxpress qxd qxt qwd qwt qxl qxb
|
||||
application/vnd.realvnc.bed bed
|
||||
application/vnd.recordare.musicxml mxl
|
||||
application/vnd.recordare.musicxml+xml musicxml
|
||||
application/vnd.rig.cryptonote cryptonote
|
||||
application/vnd.rim.cod cod
|
||||
application/vnd.rn-realmedia rm
|
||||
application/vnd.rn-realmedia-vbr rmvb
|
||||
application/vnd.route66.link66+xml link66
|
||||
application/vnd.sailingtracker.track st
|
||||
application/vnd.seemail see
|
||||
application/vnd.sema sema
|
||||
application/vnd.semd semd
|
||||
application/vnd.semf semf
|
||||
application/vnd.shana.informed.formdata ifm
|
||||
application/vnd.shana.informed.formtemplate itp
|
||||
application/vnd.shana.informed.interchange iif
|
||||
application/vnd.shana.informed.package ipk
|
||||
application/vnd.simtech-mindmapper twd twds
|
||||
application/vnd.smaf mmf
|
||||
application/vnd.smart.teacher teacher
|
||||
application/vnd.solent.sdkm+xml sdkm sdkd
|
||||
application/vnd.spotfire.dxp dxp
|
||||
application/vnd.spotfire.sfs sfs
|
||||
application/vnd.stardivision.calc sdc
|
||||
application/vnd.stardivision.draw sda
|
||||
application/vnd.stardivision.impress sdd
|
||||
application/vnd.stardivision.math smf
|
||||
application/vnd.stardivision.writer sdw vor
|
||||
application/vnd.stardivision.writer-global sgl
|
||||
application/vnd.stepmania.package smzip
|
||||
application/vnd.stepmania.stepchart sm
|
||||
application/vnd.sun.xml.calc sxc
|
||||
application/vnd.sun.xml.calc.template stc
|
||||
application/vnd.sun.xml.draw sxd
|
||||
application/vnd.sun.xml.draw.template std
|
||||
application/vnd.sun.xml.impress sxi
|
||||
application/vnd.sun.xml.impress.template sti
|
||||
application/vnd.sun.xml.math sxm
|
||||
application/vnd.sun.xml.writer sxw
|
||||
application/vnd.sun.xml.writer.global sxg
|
||||
application/vnd.sun.xml.writer.template stw
|
||||
application/vnd.sus-calendar sus susp
|
||||
application/vnd.svd svd
|
||||
application/vnd.symbian.install sis sisx
|
||||
application/vnd.syncml+xml xsm
|
||||
application/vnd.syncml.dm+wbxml bdm
|
||||
application/vnd.syncml.dm+xml xdm
|
||||
application/vnd.tao.intent-module-archive tao
|
||||
application/vnd.tcpdump.pcap pcap cap dmp
|
||||
application/vnd.tmobile-livetv tmo
|
||||
application/vnd.trid.tpt tpt
|
||||
application/vnd.triscape.mxs mxs
|
||||
application/vnd.trueapp tra
|
||||
application/vnd.ufdl ufd ufdl
|
||||
application/vnd.uiq.theme utz
|
||||
application/vnd.umajin umj
|
||||
application/vnd.unity unityweb
|
||||
application/vnd.uoml+xml uoml
|
||||
application/vnd.vcx vcx
|
||||
application/vnd.visio vsd vst vss vsw
|
||||
application/vnd.visionary vis
|
||||
application/vnd.vsf vsf
|
||||
application/vnd.wap.wbxml wbxml
|
||||
application/vnd.wap.wmlc wmlc
|
||||
application/vnd.wap.wmlscriptc wmlsc
|
||||
application/vnd.webturbo wtb
|
||||
application/vnd.wolfram.player nbp
|
||||
application/vnd.wordperfect wpd
|
||||
application/vnd.wqd wqd
|
||||
application/vnd.wt.stf stf
|
||||
application/vnd.xara xar
|
||||
application/vnd.xfdl xfdl
|
||||
application/vnd.yamaha.hv-dic hvd
|
||||
application/vnd.yamaha.hv-script hvs
|
||||
application/vnd.yamaha.hv-voice hvp
|
||||
application/vnd.yamaha.openscoreformat osf
|
||||
application/vnd.yamaha.openscoreformat.osfpvg+xml osfpvg
|
||||
application/vnd.yamaha.smaf-audio saf
|
||||
application/vnd.yamaha.smaf-phrase spf
|
||||
application/vnd.yellowriver-custom-menu cmp
|
||||
application/vnd.zul zir zirz
|
||||
application/vnd.zzazz.deck+xml zaz
|
||||
application/voicexml+xml vxml
|
||||
application/widget wgt
|
||||
application/winhlp hlp
|
||||
application/wsdl+xml wsdl
|
||||
application/wspolicy+xml wspolicy
|
||||
application/x-7z-compressed 7z
|
||||
application/x-abiword abw
|
||||
application/x-ace-compressed ace
|
||||
application/x-apple-diskimage dmg
|
||||
application/x-authorware-bin aab x32 u32 vox
|
||||
application/x-authorware-map aam
|
||||
application/x-authorware-seg aas
|
||||
application/x-bcpio bcpio
|
||||
application/x-bittorrent torrent
|
||||
application/x-blorb blb blorb
|
||||
application/x-bzip bz
|
||||
application/x-bzip2 bz2 boz
|
||||
application/x-cbr cbr cba cbt cbz cb7
|
||||
application/x-cdlink vcd
|
||||
application/x-cfs-compressed cfs
|
||||
application/x-chat chat
|
||||
application/x-chess-pgn pgn
|
||||
application/x-conference nsc
|
||||
application/x-cpio cpio
|
||||
application/x-csh csh
|
||||
application/x-debian-package deb udeb
|
||||
application/x-dgc-compressed dgc
|
||||
application/x-director dir dcr dxr cst cct cxt w3d fgd swa
|
||||
application/x-doom wad
|
||||
application/x-dtbncx+xml ncx
|
||||
application/x-dtbook+xml dtb
|
||||
application/x-dtbresource+xml res
|
||||
application/x-dvi dvi
|
||||
application/x-envoy evy
|
||||
application/x-eva eva
|
||||
application/x-font-bdf bdf
|
||||
application/x-font-ghostscript gsf
|
||||
application/x-font-linux-psf psf
|
||||
application/x-font-pcf pcf
|
||||
application/x-font-snf snf
|
||||
application/x-font-type1 pfa pfb pfm afm
|
||||
application/x-freearc arc
|
||||
application/x-futuresplash spl
|
||||
application/x-gca-compressed gca
|
||||
application/x-glulx ulx
|
||||
application/x-gnumeric gnumeric
|
||||
application/x-gramps-xml gramps
|
||||
application/x-gtar gtar
|
||||
application/x-hdf hdf
|
||||
application/x-install-instructions install
|
||||
application/x-iso9660-image iso
|
||||
application/x-java-jnlp-file jnlp
|
||||
application/x-latex latex
|
||||
application/x-lzh-compressed lzh lha
|
||||
application/x-mie mie
|
||||
application/x-mobipocket-ebook prc mobi
|
||||
application/x-ms-application application
|
||||
application/x-ms-shortcut lnk
|
||||
application/x-ms-wmd wmd
|
||||
application/x-ms-wmz wmz
|
||||
application/x-ms-xbap xbap
|
||||
application/x-msaccess mdb
|
||||
application/x-msbinder obd
|
||||
application/x-mscardfile crd
|
||||
application/x-msclip clp
|
||||
application/x-msdownload exe dll com bat msi
|
||||
application/x-msmediaview mvb m13 m14
|
||||
application/x-msmetafile wmf wmz emf emz
|
||||
application/x-msmoney mny
|
||||
application/x-mspublisher pub
|
||||
application/x-msschedule scd
|
||||
application/x-msterminal trm
|
||||
application/x-mswrite wri
|
||||
application/x-netcdf nc cdf
|
||||
application/x-nzb nzb
|
||||
application/x-pkcs12 p12 pfx
|
||||
application/x-pkcs7-certificates p7b spc
|
||||
application/x-pkcs7-certreqresp p7r
|
||||
application/x-rar-compressed rar
|
||||
application/x-research-info-systems ris
|
||||
application/x-sh sh
|
||||
application/x-shar shar
|
||||
application/x-shockwave-flash swf
|
||||
application/x-silverlight-app xap
|
||||
application/x-sql sql
|
||||
application/x-stuffit sit
|
||||
application/x-stuffitx sitx
|
||||
application/x-subrip srt
|
||||
application/x-sv4cpio sv4cpio
|
||||
application/x-sv4crc sv4crc
|
||||
application/x-t3vm-image t3
|
||||
application/x-tads gam
|
||||
application/x-tar tar
|
||||
application/x-tcl tcl
|
||||
application/x-tex tex
|
||||
application/x-tex-tfm tfm
|
||||
application/x-texinfo texinfo texi
|
||||
application/x-tgif obj
|
||||
application/x-ustar ustar
|
||||
application/x-wais-source src
|
||||
application/x-x509-ca-cert der crt
|
||||
application/x-xfig fig
|
||||
application/x-xliff+xml xlf
|
||||
application/x-xpinstall xpi
|
||||
application/x-xz xz
|
||||
application/x-zmachine z1 z2 z3 z4 z5 z6 z7 z8
|
||||
application/xaml+xml xaml
|
||||
application/xcap-diff+xml xdf
|
||||
application/xenc+xml xenc
|
||||
application/xhtml+xml xhtml xht
|
||||
application/xml xml xsl
|
||||
application/xml-dtd dtd
|
||||
application/xop+xml xop
|
||||
application/xproc+xml xpl
|
||||
application/xslt+xml xslt
|
||||
application/xspf+xml xspf
|
||||
application/xv+xml mxml xhvml xvml xvm
|
||||
application/yang yang
|
||||
application/yin+xml yin
|
||||
application/zip zip
|
||||
audio/adpcm adp
|
||||
audio/basic au snd
|
||||
audio/midi mid midi kar rmi
|
||||
audio/mp4 m4a mp4a
|
||||
audio/mpeg mpga mp2 mp2a mp3 m2a m3a
|
||||
audio/ogg oga ogg spx
|
||||
audio/s3m s3m
|
||||
audio/silk sil
|
||||
audio/vnd.dece.audio uva uvva
|
||||
audio/vnd.digital-winds eol
|
||||
audio/vnd.dra dra
|
||||
audio/vnd.dts dts
|
||||
audio/vnd.dts.hd dtshd
|
||||
audio/vnd.lucent.voice lvp
|
||||
audio/vnd.ms-playready.media.pya pya
|
||||
audio/vnd.nuera.ecelp4800 ecelp4800
|
||||
audio/vnd.nuera.ecelp7470 ecelp7470
|
||||
audio/vnd.nuera.ecelp9600 ecelp9600
|
||||
audio/vnd.rip rip
|
||||
audio/webm weba
|
||||
audio/x-aac aac
|
||||
audio/x-aiff aif aiff aifc
|
||||
audio/x-caf caf
|
||||
audio/x-flac flac
|
||||
audio/x-matroska mka
|
||||
audio/x-mpegurl m3u
|
||||
audio/x-ms-wax wax
|
||||
audio/x-ms-wma wma
|
||||
audio/x-pn-realaudio ram ra
|
||||
audio/x-pn-realaudio-plugin rmp
|
||||
audio/x-wav wav
|
||||
audio/xm xm
|
||||
chemical/x-cdx cdx
|
||||
chemical/x-cif cif
|
||||
chemical/x-cmdf cmdf
|
||||
chemical/x-cml cml
|
||||
chemical/x-csml csml
|
||||
chemical/x-xyz xyz
|
||||
font/collection ttc
|
||||
font/otf otf
|
||||
font/ttf ttf
|
||||
font/woff woff
|
||||
font/woff2 woff2
|
||||
image/bmp bmp
|
||||
image/cgm cgm
|
||||
image/g3fax g3
|
||||
image/gif gif
|
||||
image/ief ief
|
||||
image/jpeg jpeg jpg jpe
|
||||
image/ktx ktx
|
||||
image/png png
|
||||
image/prs.btif btif
|
||||
image/sgi sgi
|
||||
image/svg+xml svg svgz
|
||||
image/tiff tiff tif
|
||||
image/vnd.adobe.photoshop psd
|
||||
image/vnd.dece.graphic uvi uvvi uvg uvvg
|
||||
image/vnd.djvu djvu djv
|
||||
image/vnd.dvb.subtitle sub
|
||||
image/vnd.dwg dwg
|
||||
image/vnd.dxf dxf
|
||||
image/vnd.fastbidsheet fbs
|
||||
image/vnd.fpx fpx
|
||||
image/vnd.fst fst
|
||||
image/vnd.fujixerox.edmics-mmr mmr
|
||||
image/vnd.fujixerox.edmics-rlc rlc
|
||||
image/vnd.ms-modi mdi
|
||||
image/vnd.ms-photo wdp
|
||||
image/vnd.net-fpx npx
|
||||
image/vnd.wap.wbmp wbmp
|
||||
image/vnd.xiff xif
|
||||
image/webp webp
|
||||
image/x-3ds 3ds
|
||||
image/x-cmu-raster ras
|
||||
image/x-cmx cmx
|
||||
image/x-freehand fh fhc fh4 fh5 fh7
|
||||
image/x-icon ico
|
||||
image/x-mrsid-image sid
|
||||
image/x-pcx pcx
|
||||
image/x-pict pic pct
|
||||
image/x-portable-anymap pnm
|
||||
image/x-portable-bitmap pbm
|
||||
image/x-portable-graymap pgm
|
||||
image/x-portable-pixmap ppm
|
||||
image/x-rgb rgb
|
||||
image/x-tga tga
|
||||
image/x-xbitmap xbm
|
||||
image/x-xpixmap xpm
|
||||
image/x-xwindowdump xwd
|
||||
message/rfc822 eml mime
|
||||
model/iges igs iges
|
||||
model/mesh msh mesh silo
|
||||
model/vnd.collada+xml dae
|
||||
model/vnd.dwf dwf
|
||||
model/vnd.gdl gdl
|
||||
model/vnd.gtw gtw
|
||||
model/vnd.mts mts
|
||||
model/vnd.vtu vtu
|
||||
model/vrml wrl vrml
|
||||
model/x3d+binary x3db x3dbz
|
||||
model/x3d+vrml x3dv x3dvz
|
||||
model/x3d+xml x3d x3dz
|
||||
text/cache-manifest appcache
|
||||
text/calendar ics ifb
|
||||
text/css css
|
||||
text/csv csv
|
||||
text/html html htm
|
||||
text/n3 n3
|
||||
text/plain txt text conf def list log in
|
||||
text/prs.lines.tag dsc
|
||||
text/richtext rtx
|
||||
text/sgml sgml sgm
|
||||
text/tab-separated-values tsv
|
||||
text/troff t tr roff man me ms
|
||||
text/turtle ttl
|
||||
text/uri-list uri uris urls
|
||||
text/vcard vcard
|
||||
text/vnd.curl curl
|
||||
text/vnd.curl.dcurl dcurl
|
||||
text/vnd.curl.mcurl mcurl
|
||||
text/vnd.curl.scurl scurl
|
||||
text/vnd.dvb.subtitle sub
|
||||
text/vnd.fly fly
|
||||
text/vnd.fmi.flexstor flx
|
||||
text/vnd.graphviz gv
|
||||
text/vnd.in3d.3dml 3dml
|
||||
text/vnd.in3d.spot spot
|
||||
text/vnd.sun.j2me.app-descriptor jad
|
||||
text/vnd.wap.wml wml
|
||||
text/vnd.wap.wmlscript wmls
|
||||
text/x-asm s asm
|
||||
text/x-c c cc cxx cpp h hh dic
|
||||
text/x-fortran f for f77 f90
|
||||
text/x-java-source java
|
||||
text/x-nfo nfo
|
||||
text/x-opml opml
|
||||
text/x-pascal p pas
|
||||
text/x-setext etx
|
||||
text/x-sfv sfv
|
||||
text/x-uuencode uu
|
||||
text/x-vcalendar vcs
|
||||
text/x-vcard vcf
|
||||
video/3gpp 3gp
|
||||
video/3gpp2 3g2
|
||||
video/h261 h261
|
||||
video/h263 h263
|
||||
video/h264 h264
|
||||
video/jpeg jpgv
|
||||
video/jpm jpm jpgm
|
||||
video/mj2 mj2 mjp2
|
||||
video/mp4 mp4 mp4v mpg4
|
||||
video/mpeg mpeg mpg mpe m1v m2v
|
||||
video/ogg ogv
|
||||
video/quicktime qt mov
|
||||
video/vnd.dece.hd uvh uvvh
|
||||
video/vnd.dece.mobile uvm uvvm
|
||||
video/vnd.dece.pd uvp uvvp
|
||||
video/vnd.dece.sd uvs uvvs
|
||||
video/vnd.dece.video uvv uvvv
|
||||
video/vnd.dvb.file dvb
|
||||
video/vnd.fvt fvt
|
||||
video/vnd.mpegurl mxu m4u
|
||||
video/vnd.ms-playready.media.pyv pyv
|
||||
video/vnd.uvvu.mp4 uvu uvvu
|
||||
video/vnd.vivo viv
|
||||
video/webm webm
|
||||
video/x-f4v f4v
|
||||
video/x-fli fli
|
||||
video/x-flv flv
|
||||
video/x-m4v m4v
|
||||
video/x-matroska mkv mk3d mks
|
||||
video/x-mng mng
|
||||
video/x-ms-asf asf asx
|
||||
video/x-ms-vob vob
|
||||
video/x-ms-wm wm
|
||||
video/x-ms-wmv wmv
|
||||
video/x-ms-wmx wmx
|
||||
video/x-ms-wvx wvx
|
||||
video/x-msvideo avi
|
||||
video/x-sgi-movie movie
|
||||
video/x-smv smv
|
||||
x-conference/x-cooltalk ice
|
||||
20
runtime/src/server/middleware/mime.ts
Normal file
20
runtime/src/server/middleware/mime.ts
Normal file
@@ -0,0 +1,20 @@
|
||||
import mime_raw from './mime-types.md';
|
||||
|
||||
const map: Map<string, string> = new Map();
|
||||
|
||||
mime_raw.split('\n').forEach((row: string) => {
|
||||
const match = /(.+?)\t+(.+)/.exec(row);
|
||||
if (!match) return;
|
||||
|
||||
const type = match[1];
|
||||
const extensions = match[2].split(' ');
|
||||
|
||||
extensions.forEach(ext => {
|
||||
map.set(ext, type);
|
||||
});
|
||||
});
|
||||
|
||||
export function lookup(file: string) {
|
||||
const match = /\.([^\.]+)$/.exec(file);
|
||||
return match && map.get(match[1]);
|
||||
}
|
||||
63
runtime/src/server/middleware/types.ts
Normal file
63
runtime/src/server/middleware/types.ts
Normal file
@@ -0,0 +1,63 @@
|
||||
import { ClientRequest, ServerResponse } from 'http';
|
||||
|
||||
export type ServerRoute = {
|
||||
pattern: RegExp;
|
||||
handlers: Record<string, Handler>;
|
||||
params: (match: RegExpMatchArray) => Record<string, string>;
|
||||
};
|
||||
|
||||
export type Page = {
|
||||
pattern: RegExp;
|
||||
parts: Array<{
|
||||
name: string;
|
||||
component: Component;
|
||||
params?: (match: RegExpMatchArray) => Record<string, string>;
|
||||
preload?: (data: any) => any | Promise<any>;
|
||||
}>
|
||||
};
|
||||
|
||||
export type Manifest = {
|
||||
server_routes: ServerRoute[];
|
||||
pages: Page[];
|
||||
root: Component;
|
||||
root_preload?: (data: any) => any | Promise<any>;
|
||||
error: Component;
|
||||
}
|
||||
|
||||
export type Handler = (req: Req, res: Res, next: () => void) => void;
|
||||
|
||||
export type Props = {
|
||||
error?: { message: string };
|
||||
status?: number;
|
||||
child: {
|
||||
segment: string;
|
||||
component: Component;
|
||||
props: Props;
|
||||
};
|
||||
[key: string]: any;
|
||||
};
|
||||
|
||||
export interface Req extends ClientRequest {
|
||||
url: string;
|
||||
baseUrl: string;
|
||||
originalUrl: string;
|
||||
method: string;
|
||||
path: string;
|
||||
params: Record<string, string>;
|
||||
query: Record<string, string>;
|
||||
headers: Record<string, string>;
|
||||
}
|
||||
|
||||
export interface Res extends ServerResponse {
|
||||
write: (data: any) => void;
|
||||
}
|
||||
|
||||
export { ServerResponse };
|
||||
|
||||
interface Component {
|
||||
render: (data: any) => {
|
||||
head: string;
|
||||
css: { code: string, map: any };
|
||||
html: string
|
||||
}
|
||||
}
|
||||
@@ -1,9 +1,11 @@
|
||||
let source;
|
||||
|
||||
function check() {
|
||||
if (typeof module === 'undefined') return;
|
||||
|
||||
if (module.hot.status() === 'idle') {
|
||||
module.hot.check(true).then(modules => {
|
||||
console.log(`HMR updated`);
|
||||
console.log(`[SAPPER] applied HMR update`);
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -11,16 +13,26 @@ function check() {
|
||||
export function connect(port) {
|
||||
if (source || !window.EventSource) return;
|
||||
|
||||
source = new EventSource(`http://localhost:${port}/hmr`);
|
||||
source = new EventSource(`http://${window.location.hostname}:${port}/__sapper__`);
|
||||
|
||||
window.source = source;
|
||||
|
||||
source.onopen = function(event) {
|
||||
console.log(`HMR connected`);
|
||||
console.log(`[SAPPER] dev client connected`);
|
||||
};
|
||||
|
||||
source.onerror = function(error) {
|
||||
console.error(error);
|
||||
};
|
||||
|
||||
source.onmessage = function(event) {
|
||||
const data = JSON.parse(event.data);
|
||||
if (!data) return; // just a heartbeat
|
||||
|
||||
if (data.action === 'reload') {
|
||||
window.location.reload();
|
||||
}
|
||||
|
||||
if (data.status === 'completed') {
|
||||
check();
|
||||
}
|
||||
4
src/api.ts
Normal file
4
src/api.ts
Normal file
@@ -0,0 +1,4 @@
|
||||
export { dev } from './api/dev';
|
||||
export { build } from './api/build';
|
||||
export { export } from './api/export';
|
||||
export { find_page } from './api/find_page';
|
||||
142
src/api/build.ts
Normal file
142
src/api/build.ts
Normal file
@@ -0,0 +1,142 @@
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
import mkdirp from 'mkdirp';
|
||||
import rimraf from 'rimraf';
|
||||
import minify_html from './utils/minify_html';
|
||||
import { create_compilers, create_main_manifests, create_manifest_data, create_serviceworker_manifest } from '../core';
|
||||
import { copy_shimport } from './utils/copy_shimport';
|
||||
import read_template from '../core/read_template';
|
||||
import { CompileResult } from '../core/create_compilers/interfaces';
|
||||
import { noop } from './utils/noop';
|
||||
import validate_bundler from './utils/validate_bundler';
|
||||
import { copy_runtime } from './utils/copy_runtime';
|
||||
|
||||
type Opts = {
|
||||
cwd?: string;
|
||||
src?: string;
|
||||
routes?: string;
|
||||
dest?: string;
|
||||
output?: string;
|
||||
static?: string;
|
||||
legacy?: boolean;
|
||||
bundler?: 'rollup' | 'webpack';
|
||||
oncompile?: ({ type, result }: { type: string, result: CompileResult }) => void;
|
||||
};
|
||||
|
||||
export async function build({
|
||||
cwd,
|
||||
src = 'src',
|
||||
routes = 'src/routes',
|
||||
output = 'src/node_modules/@sapper',
|
||||
static: static_files = 'static',
|
||||
dest = '__sapper__/build',
|
||||
|
||||
bundler,
|
||||
legacy = false,
|
||||
oncompile = noop
|
||||
}: Opts = {}) {
|
||||
bundler = validate_bundler(bundler);
|
||||
|
||||
cwd = path.resolve(cwd);
|
||||
src = path.resolve(cwd, src);
|
||||
dest = path.resolve(cwd, dest);
|
||||
routes = path.resolve(cwd, routes);
|
||||
output = path.resolve(cwd, output);
|
||||
static_files = path.resolve(cwd, static_files);
|
||||
|
||||
if (legacy && bundler === 'webpack') {
|
||||
throw new Error(`Legacy builds are not supported for projects using webpack`);
|
||||
}
|
||||
|
||||
rimraf.sync(path.join(output, '**/*'));
|
||||
mkdirp.sync(output);
|
||||
copy_runtime(output);
|
||||
|
||||
rimraf.sync(path.join(dest, '**/*'));
|
||||
mkdirp.sync(`${dest}/client`);
|
||||
copy_shimport(dest);
|
||||
|
||||
// minify src/template.html
|
||||
// TODO compile this to a function? could be quicker than str.replace(...).replace(...).replace(...)
|
||||
const template = read_template(src);
|
||||
|
||||
// remove this in a future version
|
||||
if (template.indexOf('%sapper.base%') === -1) {
|
||||
const error = new Error(`As of Sapper v0.10, your template.html file must include %sapper.base% in the <head>`);
|
||||
error.code = `missing-sapper-base`;
|
||||
throw error;
|
||||
}
|
||||
|
||||
fs.writeFileSync(`${dest}/template.html`, minify_html(template));
|
||||
|
||||
const manifest_data = create_manifest_data(routes);
|
||||
|
||||
// create src/node_modules/@sapper/app.mjs and server.mjs
|
||||
create_main_manifests({
|
||||
bundler,
|
||||
manifest_data,
|
||||
cwd,
|
||||
src,
|
||||
dest,
|
||||
routes,
|
||||
output,
|
||||
dev: false
|
||||
});
|
||||
|
||||
const { client, server, serviceworker } = await create_compilers(bundler, cwd, src, dest, true);
|
||||
|
||||
const client_result = await client.compile();
|
||||
oncompile({
|
||||
type: 'client',
|
||||
result: client_result
|
||||
});
|
||||
|
||||
const build_info = client_result.to_json(manifest_data, { src, routes, dest });
|
||||
|
||||
if (legacy) {
|
||||
process.env.SAPPER_LEGACY_BUILD = 'true';
|
||||
const { client } = await create_compilers(bundler, cwd, src, dest, true);
|
||||
|
||||
const client_result = await client.compile();
|
||||
|
||||
oncompile({
|
||||
type: 'client (legacy)',
|
||||
result: client_result
|
||||
});
|
||||
|
||||
client_result.to_json(manifest_data, { src, routes, dest });
|
||||
build_info.legacy_assets = client_result.assets;
|
||||
delete process.env.SAPPER_LEGACY_BUILD;
|
||||
}
|
||||
|
||||
fs.writeFileSync(path.join(dest, 'build.json'), JSON.stringify(build_info));
|
||||
|
||||
const server_stats = await server.compile();
|
||||
oncompile({
|
||||
type: 'server',
|
||||
result: server_stats
|
||||
});
|
||||
|
||||
let serviceworker_stats;
|
||||
|
||||
if (serviceworker) {
|
||||
|
||||
const client_files = client_result.chunks
|
||||
.filter(chunk => !chunk.file.endsWith('.map')) // SW does not need to cache sourcemap files
|
||||
.map(chunk => `client/${chunk.file}`);
|
||||
|
||||
create_serviceworker_manifest({
|
||||
manifest_data,
|
||||
output,
|
||||
client_files,
|
||||
static_files
|
||||
});
|
||||
|
||||
serviceworker_stats = await serviceworker.compile();
|
||||
|
||||
oncompile({
|
||||
type: 'serviceworker',
|
||||
result: serviceworker_stats
|
||||
});
|
||||
}
|
||||
}
|
||||
513
src/api/dev.ts
Normal file
513
src/api/dev.ts
Normal file
@@ -0,0 +1,513 @@
|
||||
import * as path from 'path';
|
||||
import * as fs from 'fs';
|
||||
import * as http from 'http';
|
||||
import * as child_process from 'child_process';
|
||||
import * as ports from 'port-authority';
|
||||
import mkdirp from 'mkdirp';
|
||||
import rimraf from 'rimraf';
|
||||
import { EventEmitter } from 'events';
|
||||
import { create_manifest_data, create_main_manifests, create_compilers, create_serviceworker_manifest } from '../core';
|
||||
import { Compiler, Compilers } from '../core/create_compilers';
|
||||
import { CompileResult } from '../core/create_compilers/interfaces';
|
||||
import Deferred from './utils/Deferred';
|
||||
import validate_bundler from './utils/validate_bundler';
|
||||
import { copy_shimport } from './utils/copy_shimport';
|
||||
import { ManifestData, FatalEvent, ErrorEvent, ReadyEvent, InvalidEvent } from '../interfaces';
|
||||
import read_template from '../core/read_template';
|
||||
import { noop } from './utils/noop';
|
||||
import { copy_runtime } from './utils/copy_runtime';
|
||||
|
||||
type Opts = {
|
||||
cwd?: string,
|
||||
src?: string,
|
||||
dest?: string,
|
||||
routes?: string,
|
||||
output?: string,
|
||||
static?: string,
|
||||
'dev-port'?: number,
|
||||
live?: boolean,
|
||||
hot?: boolean,
|
||||
'devtools-port'?: number,
|
||||
bundler?: 'rollup' | 'webpack',
|
||||
port?: number
|
||||
};
|
||||
|
||||
export function dev(opts: Opts) {
|
||||
return new Watcher(opts);
|
||||
}
|
||||
|
||||
class Watcher extends EventEmitter {
|
||||
bundler: 'rollup' | 'webpack';
|
||||
dirs: {
|
||||
cwd: string;
|
||||
src: string;
|
||||
dest: string;
|
||||
routes: string;
|
||||
output: string;
|
||||
static: string;
|
||||
}
|
||||
port: number;
|
||||
closed: boolean;
|
||||
|
||||
dev_port: number;
|
||||
live: boolean;
|
||||
hot: boolean;
|
||||
|
||||
devtools_port: number;
|
||||
|
||||
dev_server: DevServer;
|
||||
proc: child_process.ChildProcess;
|
||||
filewatchers: Array<{ close: () => void }>;
|
||||
deferred: Deferred;
|
||||
|
||||
crashed: boolean;
|
||||
restarting: boolean;
|
||||
current_build: {
|
||||
changed: Set<string>;
|
||||
rebuilding: Set<string>;
|
||||
unique_warnings: Set<string>;
|
||||
unique_errors: Set<string>;
|
||||
}
|
||||
|
||||
constructor({
|
||||
cwd = '.',
|
||||
src = 'src',
|
||||
routes = 'src/routes',
|
||||
output = 'src/node_modules/@sapper',
|
||||
static: static_files = 'static',
|
||||
dest = '__sapper__/dev',
|
||||
'dev-port': dev_port,
|
||||
live,
|
||||
hot,
|
||||
'devtools-port': devtools_port,
|
||||
bundler,
|
||||
port = +process.env.PORT
|
||||
}: Opts) {
|
||||
super();
|
||||
|
||||
cwd = path.resolve(cwd);
|
||||
|
||||
this.bundler = validate_bundler(bundler);
|
||||
this.dirs = {
|
||||
cwd,
|
||||
src: path.resolve(cwd, src),
|
||||
dest: path.resolve(cwd, dest),
|
||||
routes: path.resolve(cwd, routes),
|
||||
output: path.resolve(cwd, output),
|
||||
static: path.resolve(cwd, static_files)
|
||||
};
|
||||
|
||||
this.port = port;
|
||||
this.closed = false;
|
||||
|
||||
this.dev_port = dev_port;
|
||||
this.live = live;
|
||||
this.hot = hot;
|
||||
|
||||
this.devtools_port = devtools_port;
|
||||
|
||||
this.filewatchers = [];
|
||||
|
||||
this.current_build = {
|
||||
changed: new Set(),
|
||||
rebuilding: new Set(),
|
||||
unique_errors: new Set(),
|
||||
unique_warnings: new Set()
|
||||
};
|
||||
|
||||
// remove this in a future version
|
||||
const template = read_template(src);
|
||||
if (template.indexOf('%sapper.base%') === -1) {
|
||||
const error = new Error(`As of Sapper v0.10, your template.html file must include %sapper.base% in the <head>`);
|
||||
error.code = `missing-sapper-base`;
|
||||
throw error;
|
||||
}
|
||||
|
||||
process.env.NODE_ENV = 'development';
|
||||
|
||||
process.on('exit', () => {
|
||||
this.close();
|
||||
});
|
||||
|
||||
this.init();
|
||||
}
|
||||
|
||||
async init() {
|
||||
if (this.port) {
|
||||
if (!await ports.check(this.port)) {
|
||||
this.emit('fatal', <FatalEvent>{
|
||||
message: `Port ${this.port} is unavailable`
|
||||
});
|
||||
return;
|
||||
}
|
||||
} else {
|
||||
this.port = await ports.find(3000);
|
||||
}
|
||||
|
||||
const { cwd, src, dest, routes, output, static: static_files } = this.dirs;
|
||||
|
||||
rimraf.sync(path.join(output, '**/*'));
|
||||
mkdirp.sync(output);
|
||||
copy_runtime(output);
|
||||
|
||||
rimraf.sync(dest);
|
||||
mkdirp.sync(`${dest}/client`);
|
||||
if (this.bundler === 'rollup') copy_shimport(dest);
|
||||
|
||||
if (!this.dev_port) this.dev_port = await ports.find(10000);
|
||||
|
||||
// Chrome looks for debugging targets on ports 9222 and 9229 by default
|
||||
if (!this.devtools_port) this.devtools_port = await ports.find(9222);
|
||||
|
||||
let manifest_data: ManifestData;
|
||||
|
||||
try {
|
||||
manifest_data = create_manifest_data(routes);
|
||||
create_main_manifests({
|
||||
bundler: this.bundler,
|
||||
manifest_data,
|
||||
dev: true,
|
||||
dev_port: this.dev_port,
|
||||
cwd, src, dest, routes, output
|
||||
});
|
||||
} catch (err) {
|
||||
this.emit('fatal', <FatalEvent>{
|
||||
message: err.message
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
this.dev_server = new DevServer(this.dev_port);
|
||||
|
||||
this.filewatchers.push(
|
||||
watch_dir(
|
||||
routes,
|
||||
({ path: file, stats }) => {
|
||||
if (stats.isDirectory()) {
|
||||
return path.basename(file)[0] !== '_';
|
||||
}
|
||||
return true;
|
||||
},
|
||||
() => {
|
||||
try {
|
||||
const new_manifest_data = create_manifest_data(routes);
|
||||
create_main_manifests({
|
||||
bundler: this.bundler,
|
||||
manifest_data, // TODO is this right? not new_manifest_data?
|
||||
dev: true,
|
||||
dev_port: this.dev_port,
|
||||
cwd, src, dest, routes, output
|
||||
});
|
||||
|
||||
manifest_data = new_manifest_data;
|
||||
} catch (err) {
|
||||
this.emit('error', <ErrorEvent>{
|
||||
message: err.message
|
||||
});
|
||||
}
|
||||
}
|
||||
),
|
||||
|
||||
fs.watch(`${src}/template.html`, () => {
|
||||
this.dev_server.send({
|
||||
action: 'reload'
|
||||
});
|
||||
})
|
||||
);
|
||||
|
||||
let deferred = new Deferred();
|
||||
|
||||
// TODO watch the configs themselves?
|
||||
const compilers: Compilers = await create_compilers(this.bundler, cwd, src, dest, false);
|
||||
|
||||
const emitFatal = () => {
|
||||
this.emit('fatal', <FatalEvent>{
|
||||
message: `Server crashed`
|
||||
});
|
||||
|
||||
this.crashed = true;
|
||||
this.proc = null;
|
||||
};
|
||||
|
||||
this.watch(compilers.server, {
|
||||
name: 'server',
|
||||
|
||||
invalid: filename => {
|
||||
this.restart(filename, 'server');
|
||||
},
|
||||
|
||||
handle_result: (result: CompileResult) => {
|
||||
deferred.promise.then(() => {
|
||||
const restart = () => {
|
||||
this.crashed = false;
|
||||
|
||||
ports.wait(this.port)
|
||||
.then((() => {
|
||||
this.emit('ready', <ReadyEvent>{
|
||||
port: this.port,
|
||||
process: this.proc
|
||||
});
|
||||
|
||||
if (this.hot && this.bundler === 'webpack') {
|
||||
this.dev_server.send({
|
||||
status: 'completed'
|
||||
});
|
||||
} else {
|
||||
this.dev_server.send({
|
||||
action: 'reload'
|
||||
});
|
||||
}
|
||||
}))
|
||||
.catch(err => {
|
||||
if (this.crashed) return;
|
||||
|
||||
this.emit('fatal', <FatalEvent>{
|
||||
message: `Server is not listening on port ${this.port}`
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
if (this.proc) {
|
||||
this.proc.removeListener('exit', emitFatal);
|
||||
this.proc.kill();
|
||||
this.proc.on('exit', restart);
|
||||
} else {
|
||||
restart();
|
||||
}
|
||||
|
||||
// we need to give the child process its own DevTools port,
|
||||
// otherwise Node will try to use the parent's (and fail)
|
||||
const debugArgRegex = /--inspect(?:-brk|-port)?|--debug-port/;
|
||||
const execArgv = process.execArgv.slice();
|
||||
if (execArgv.some((arg: string) => !!arg.match(debugArgRegex))) {
|
||||
execArgv.push(`--inspect-port=${this.devtools_port}`);
|
||||
}
|
||||
|
||||
this.proc = child_process.fork(`${dest}/server/server.js`, [], {
|
||||
cwd: process.cwd(),
|
||||
env: Object.assign({
|
||||
PORT: this.port
|
||||
}, process.env),
|
||||
stdio: ['ipc'],
|
||||
execArgv
|
||||
});
|
||||
|
||||
this.proc.stdout.on('data', chunk => {
|
||||
this.emit('stdout', chunk);
|
||||
});
|
||||
|
||||
this.proc.stderr.on('data', chunk => {
|
||||
this.emit('stderr', chunk);
|
||||
});
|
||||
|
||||
this.proc.on('message', message => {
|
||||
if (message.__sapper__ && message.event === 'basepath') {
|
||||
this.emit('basepath', {
|
||||
basepath: message.basepath
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
this.proc.on('exit', emitFatal);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
this.watch(compilers.client, {
|
||||
name: 'client',
|
||||
|
||||
invalid: filename => {
|
||||
this.restart(filename, 'client');
|
||||
deferred = new Deferred();
|
||||
|
||||
// TODO we should delete old assets. due to a webpack bug
|
||||
// i don't even begin to comprehend, this is apparently
|
||||
// quite difficult
|
||||
},
|
||||
|
||||
handle_result: (result: CompileResult) => {
|
||||
fs.writeFileSync(
|
||||
path.join(dest, 'build.json'),
|
||||
|
||||
// TODO should be more explicit that to_json has effects
|
||||
JSON.stringify(result.to_json(manifest_data, this.dirs), null, ' ')
|
||||
);
|
||||
|
||||
const client_files = result.chunks.map(chunk => `client/${chunk.file}`);
|
||||
|
||||
create_serviceworker_manifest({
|
||||
manifest_data,
|
||||
output,
|
||||
client_files,
|
||||
static_files
|
||||
});
|
||||
|
||||
deferred.fulfil();
|
||||
|
||||
// we need to wait a beat before watching the service
|
||||
// worker, because of some webpack nonsense
|
||||
setTimeout(watch_serviceworker, 100);
|
||||
}
|
||||
});
|
||||
|
||||
let watch_serviceworker = compilers.serviceworker
|
||||
? () => {
|
||||
watch_serviceworker = noop;
|
||||
|
||||
this.watch(compilers.serviceworker, {
|
||||
name: 'service worker'
|
||||
});
|
||||
}
|
||||
: noop;
|
||||
}
|
||||
|
||||
close() {
|
||||
if (this.closed) return;
|
||||
this.closed = true;
|
||||
|
||||
if (this.dev_server) this.dev_server.close();
|
||||
|
||||
if (this.proc) this.proc.kill();
|
||||
this.filewatchers.forEach(watcher => {
|
||||
watcher.close();
|
||||
});
|
||||
}
|
||||
|
||||
restart(filename: string, type: string) {
|
||||
if (this.restarting) {
|
||||
this.current_build.changed.add(filename);
|
||||
this.current_build.rebuilding.add(type);
|
||||
} else {
|
||||
this.restarting = true;
|
||||
|
||||
this.current_build = {
|
||||
changed: new Set([filename]),
|
||||
rebuilding: new Set([type]),
|
||||
unique_warnings: new Set(),
|
||||
unique_errors: new Set()
|
||||
};
|
||||
|
||||
process.nextTick(() => {
|
||||
this.emit('invalid', <InvalidEvent>{
|
||||
changed: Array.from(this.current_build.changed),
|
||||
invalid: {
|
||||
server: this.current_build.rebuilding.has('server'),
|
||||
client: this.current_build.rebuilding.has('client'),
|
||||
serviceworker: this.current_build.rebuilding.has('serviceworker'),
|
||||
}
|
||||
});
|
||||
|
||||
this.restarting = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
watch(compiler: Compiler, { name, invalid = noop, handle_result = noop }: {
|
||||
name: string,
|
||||
invalid?: (filename: string) => void;
|
||||
handle_result?: (result: CompileResult) => void;
|
||||
}) {
|
||||
compiler.oninvalid(invalid);
|
||||
|
||||
compiler.watch((err?: Error, result?: CompileResult) => {
|
||||
if (err) {
|
||||
this.emit('error', <ErrorEvent>{
|
||||
type: name,
|
||||
message: err.message
|
||||
});
|
||||
} else {
|
||||
this.emit('build', {
|
||||
type: name,
|
||||
|
||||
duration: result.duration,
|
||||
errors: result.errors,
|
||||
warnings: result.warnings
|
||||
});
|
||||
|
||||
handle_result(result);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
const INTERVAL = 10000;
|
||||
|
||||
class DevServer {
|
||||
clients: Set<http.ServerResponse>;
|
||||
interval: NodeJS.Timer;
|
||||
_: http.Server;
|
||||
|
||||
constructor(port: number, interval = 10000) {
|
||||
this.clients = new Set();
|
||||
|
||||
this._ = http.createServer((req, res) => {
|
||||
if (req.url !== '/__sapper__') return;
|
||||
|
||||
req.socket.setKeepAlive(true);
|
||||
res.writeHead(200, {
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
'Access-Control-Allow-Headers': 'Cache-Control',
|
||||
'Content-Type': 'text/event-stream;charset=utf-8',
|
||||
'Cache-Control': 'no-cache, no-transform',
|
||||
'Connection': 'keep-alive',
|
||||
// While behind nginx, event stream should not be buffered:
|
||||
// http://nginx.org/docs/http/ngx_http_proxy_module.html#proxy_buffering
|
||||
'X-Accel-Buffering': 'no'
|
||||
});
|
||||
|
||||
res.write('\n');
|
||||
|
||||
this.clients.add(res);
|
||||
req.on('close', () => {
|
||||
this.clients.delete(res);
|
||||
});
|
||||
});
|
||||
|
||||
this._.listen(port);
|
||||
|
||||
this.interval = setInterval(() => {
|
||||
this.send(null);
|
||||
}, INTERVAL);
|
||||
}
|
||||
|
||||
close() {
|
||||
this._.close();
|
||||
clearInterval(this.interval);
|
||||
}
|
||||
|
||||
send(data: any) {
|
||||
this.clients.forEach(client => {
|
||||
client.write(`data: ${JSON.stringify(data)}\n\n`);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function watch_dir(
|
||||
dir: string,
|
||||
filter: ({ path, stats }: { path: string, stats: fs.Stats }) => boolean,
|
||||
callback: () => void
|
||||
) {
|
||||
let watch: any;
|
||||
let closed = false;
|
||||
|
||||
import('cheap-watch').then(({ default: CheapWatch }) => {
|
||||
if (closed) return;
|
||||
|
||||
watch = new CheapWatch({ dir, filter, debounce: 50 });
|
||||
|
||||
watch.on('+', ({ isNew }: { isNew: boolean }) => {
|
||||
if (isNew) callback();
|
||||
});
|
||||
|
||||
watch.on('-', callback);
|
||||
|
||||
watch.init();
|
||||
});
|
||||
|
||||
return {
|
||||
close: () => {
|
||||
if (watch) watch.close();
|
||||
closed = true;
|
||||
}
|
||||
};
|
||||
}
|
||||
202
src/api/export.ts
Normal file
202
src/api/export.ts
Normal file
@@ -0,0 +1,202 @@
|
||||
import * as child_process from 'child_process';
|
||||
import * as path from 'path';
|
||||
import * as sander from 'sander';
|
||||
import * as url from 'url';
|
||||
import fetch from 'node-fetch';
|
||||
import * as yootils from 'yootils';
|
||||
import * as ports from 'port-authority';
|
||||
import clean_html from './utils/clean_html';
|
||||
import minify_html from './utils/minify_html';
|
||||
import Deferred from './utils/Deferred';
|
||||
import { noop } from './utils/noop';
|
||||
|
||||
type Opts = {
|
||||
build_dir?: string,
|
||||
export_dir?: string,
|
||||
cwd?: string,
|
||||
static?: string,
|
||||
basepath?: string,
|
||||
timeout?: number | false,
|
||||
oninfo?: ({ message }: { message: string }) => void;
|
||||
onfile?: ({ file, size, status }: { file: string, size: number, status: number }) => void;
|
||||
};
|
||||
|
||||
function resolve(from: string, to: string) {
|
||||
return url.parse(url.resolve(from, to));
|
||||
}
|
||||
|
||||
type URL = url.UrlWithStringQuery;
|
||||
|
||||
export { _export as export };
|
||||
|
||||
async function _export({
|
||||
cwd,
|
||||
static: static_files = 'static',
|
||||
build_dir = '__sapper__/build',
|
||||
export_dir = '__sapper__/export',
|
||||
basepath = '',
|
||||
timeout = 5000,
|
||||
oninfo = noop,
|
||||
onfile = noop
|
||||
}: Opts = {}) {
|
||||
basepath = basepath.replace(/^\//, '')
|
||||
|
||||
cwd = path.resolve(cwd);
|
||||
static_files = path.resolve(cwd, static_files);
|
||||
build_dir = path.resolve(cwd, build_dir);
|
||||
export_dir = path.resolve(cwd, export_dir, basepath);
|
||||
|
||||
// Prep output directory
|
||||
sander.rimrafSync(export_dir);
|
||||
|
||||
sander.copydirSync(static_files).to(export_dir);
|
||||
sander.copydirSync(build_dir, 'client').to(export_dir, 'client');
|
||||
|
||||
if (sander.existsSync(build_dir, 'service-worker.js')) {
|
||||
sander.copyFileSync(build_dir, 'service-worker.js').to(export_dir, 'service-worker.js');
|
||||
}
|
||||
|
||||
if (sander.existsSync(build_dir, 'service-worker.js.map')) {
|
||||
sander.copyFileSync(build_dir, 'service-worker.js.map').to(export_dir, 'service-worker.js.map');
|
||||
}
|
||||
|
||||
const port = await ports.find(3000);
|
||||
|
||||
const protocol = 'http:';
|
||||
const host = `localhost:${port}`;
|
||||
const origin = `${protocol}//${host}`;
|
||||
|
||||
const root = resolve(origin, basepath);
|
||||
if (!root.href.endsWith('/')) root.href += '/';
|
||||
|
||||
oninfo({
|
||||
message: `Crawling ${root.href}`
|
||||
});
|
||||
|
||||
const proc = child_process.fork(path.resolve(`${build_dir}/server/server.js`), [], {
|
||||
cwd,
|
||||
env: Object.assign({
|
||||
PORT: port,
|
||||
NODE_ENV: 'production',
|
||||
SAPPER_EXPORT: 'true'
|
||||
}, process.env)
|
||||
});
|
||||
|
||||
const seen = new Set();
|
||||
const saved = new Set();
|
||||
|
||||
function save(path: string, status: number, type: string, body: string) {
|
||||
const { pathname } = resolve(origin, path);
|
||||
let file = decodeURIComponent(pathname.slice(1));
|
||||
|
||||
if (saved.has(file)) return;
|
||||
saved.add(file);
|
||||
|
||||
const is_html = type === 'text/html';
|
||||
|
||||
if (is_html) {
|
||||
if (pathname !== '/service-worker-index.html') {
|
||||
file = file === '' ? 'index.html' : `${file}/index.html`;
|
||||
}
|
||||
body = minify_html(body);
|
||||
}
|
||||
|
||||
onfile({
|
||||
file,
|
||||
size: body.length,
|
||||
status
|
||||
});
|
||||
|
||||
sander.writeFileSync(export_dir, file, body);
|
||||
}
|
||||
|
||||
proc.on('message', message => {
|
||||
if (!message.__sapper__ || message.event !== 'file') return;
|
||||
save(message.url, message.status, message.type, message.body);
|
||||
});
|
||||
|
||||
async function handle(url: URL) {
|
||||
let pathname = url.pathname;
|
||||
if (pathname !== '/service-worker-index.html') {
|
||||
pathname = pathname.replace(root.pathname, '') || '/'
|
||||
}
|
||||
|
||||
if (seen.has(pathname)) return;
|
||||
seen.add(pathname);
|
||||
|
||||
const timeout_deferred = new Deferred();
|
||||
const the_timeout = setTimeout(() => {
|
||||
timeout_deferred.reject(new Error(`Timed out waiting for ${url.href}`));
|
||||
}, timeout);
|
||||
|
||||
const r = await Promise.race([
|
||||
fetch(url.href, {
|
||||
redirect: 'manual'
|
||||
}),
|
||||
timeout_deferred.promise
|
||||
]);
|
||||
|
||||
clearTimeout(the_timeout); // prevent it hanging at the end
|
||||
|
||||
let type = r.headers.get('Content-Type');
|
||||
let body = await r.text();
|
||||
|
||||
const range = ~~(r.status / 100);
|
||||
|
||||
if (range === 2) {
|
||||
if (type === 'text/html' && pathname !== '/service-worker-index.html') {
|
||||
const cleaned = clean_html(body);
|
||||
|
||||
const q = yootils.queue(8);
|
||||
let promise;
|
||||
|
||||
const base_match = /<base ([\s\S]+?)>/m.exec(cleaned);
|
||||
const base_href = base_match && get_href(base_match[1]);
|
||||
const base = resolve(url.href, base_href);
|
||||
|
||||
let match;
|
||||
let pattern = /<a ([\s\S]+?)>/gm;
|
||||
|
||||
while (match = pattern.exec(cleaned)) {
|
||||
const attrs = match[1];
|
||||
const href = get_href(attrs);
|
||||
|
||||
if (href) {
|
||||
const url = resolve(base.href, href);
|
||||
|
||||
if (url.protocol === protocol && url.host === host) {
|
||||
promise = q.add(() => handle(url));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
await promise;
|
||||
}
|
||||
}
|
||||
|
||||
if (range === 3) {
|
||||
const location = r.headers.get('Location');
|
||||
|
||||
type = 'text/html';
|
||||
body = `<script>window.location.href = "${location.replace(origin, '')}"</script>`;
|
||||
|
||||
await handle(resolve(root.href, location));
|
||||
}
|
||||
|
||||
save(pathname, r.status, type, body);
|
||||
}
|
||||
|
||||
return ports.wait(port)
|
||||
.then(() => handle(root))
|
||||
.then(() => handle(resolve(root.href, 'service-worker-index.html')))
|
||||
.then(() => proc.kill())
|
||||
.catch(err => {
|
||||
proc.kill();
|
||||
throw err;
|
||||
});
|
||||
}
|
||||
|
||||
function get_href(attrs: string) {
|
||||
const match = /href\s*=\s*(?:"(.*?)"|'(.+?)'|([^\s>]+))/.exec(attrs);
|
||||
return match[1] || match[2] || match[3];
|
||||
}
|
||||
13
src/api/find_page.ts
Normal file
13
src/api/find_page.ts
Normal file
@@ -0,0 +1,13 @@
|
||||
import { create_manifest_data } from '../core';
|
||||
|
||||
export function find_page(pathname: string, cwd = 'src/routes') {
|
||||
const { pages } = create_manifest_data(cwd);
|
||||
|
||||
for (let i = 0; i < pages.length; i += 1) {
|
||||
const page = pages[i];
|
||||
|
||||
if (page.pattern.test(pathname)) {
|
||||
return page.parts[page.parts.length - 1].component.file;
|
||||
}
|
||||
}
|
||||
}
|
||||
12
src/api/utils/Deferred.ts
Normal file
12
src/api/utils/Deferred.ts
Normal file
@@ -0,0 +1,12 @@
|
||||
export default class Deferred {
|
||||
promise: Promise<any>;
|
||||
fulfil: (value?: any) => void;
|
||||
reject: (error: Error) => void;
|
||||
|
||||
constructor() {
|
||||
this.promise = new Promise((fulfil, reject) => {
|
||||
this.fulfil = fulfil;
|
||||
this.reject = reject;
|
||||
});
|
||||
}
|
||||
}
|
||||
7
src/api/utils/clean_html.ts
Normal file
7
src/api/utils/clean_html.ts
Normal file
@@ -0,0 +1,7 @@
|
||||
export default function clean_html(html: string) {
|
||||
return html
|
||||
.replace(/<!\[CDATA\[[\s\S]*?\]\]>/gm, '')
|
||||
.replace(/(<script[\s\S]*?>)[\s\S]*?<\/script>/gm, '$1</' + 'script>')
|
||||
.replace(/(<style[\s\S]*?>)[\s\S]*?<\/style>/gm, '$1</' + 'style>')
|
||||
.replace(/<!--[\s\S]*?-->/gm, '');
|
||||
}
|
||||
21
src/api/utils/copy_runtime.ts
Normal file
21
src/api/utils/copy_runtime.ts
Normal file
@@ -0,0 +1,21 @@
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
import mkdirp from 'mkdirp';
|
||||
|
||||
const runtime = [
|
||||
'app.mjs',
|
||||
'server.mjs',
|
||||
'internal/shared.mjs',
|
||||
'internal/Sapper.html',
|
||||
'internal/layout.html'
|
||||
].map(file => ({
|
||||
file,
|
||||
source: fs.readFileSync(path.join(__dirname, `../runtime/${file}`), 'utf-8')
|
||||
}));
|
||||
|
||||
export function copy_runtime(output: string) {
|
||||
runtime.forEach(({ file, source }) => {
|
||||
mkdirp.sync(path.dirname(`${output}/${file}`));
|
||||
fs.writeFileSync(`${output}/${file}`, source);
|
||||
});
|
||||
}
|
||||
9
src/api/utils/copy_shimport.ts
Normal file
9
src/api/utils/copy_shimport.ts
Normal file
@@ -0,0 +1,9 @@
|
||||
import * as fs from 'fs';
|
||||
|
||||
export function copy_shimport(dest: string) {
|
||||
const shimport_version = require('shimport/package.json').version;
|
||||
fs.writeFileSync(
|
||||
`${dest}/client/shimport@${shimport_version}.js`,
|
||||
fs.readFileSync(require.resolve('shimport/index.js'))
|
||||
);
|
||||
}
|
||||
22
src/api/utils/minify_html.ts
Normal file
22
src/api/utils/minify_html.ts
Normal file
@@ -0,0 +1,22 @@
|
||||
import { minify } from 'html-minifier';
|
||||
|
||||
export default function minify_html(html: string) {
|
||||
return minify(html, {
|
||||
collapseBooleanAttributes: true,
|
||||
collapseWhitespace: true,
|
||||
conservativeCollapse: true,
|
||||
decodeEntities: true,
|
||||
html5: true,
|
||||
ignoreCustomComments: [/^#/],
|
||||
minifyCSS: true,
|
||||
minifyJS: false,
|
||||
removeAttributeQuotes: true,
|
||||
removeComments: true,
|
||||
removeOptionalTags: true,
|
||||
removeRedundantAttributes: true,
|
||||
removeScriptTypeAttributes: true,
|
||||
removeStyleLinkTypeAttributes: true,
|
||||
sortAttributes: true,
|
||||
sortClassName: true
|
||||
});
|
||||
}
|
||||
1
src/api/utils/noop.ts
Normal file
1
src/api/utils/noop.ts
Normal file
@@ -0,0 +1 @@
|
||||
export function noop() {}
|
||||
38
src/api/utils/validate_bundler.ts
Normal file
38
src/api/utils/validate_bundler.ts
Normal file
@@ -0,0 +1,38 @@
|
||||
import * as fs from 'fs';
|
||||
|
||||
export default function validate_bundler(bundler?: 'rollup' | 'webpack') {
|
||||
if (!bundler) {
|
||||
bundler = (
|
||||
fs.existsSync('rollup.config.js') ? 'rollup' :
|
||||
fs.existsSync('webpack.config.js') ? 'webpack' :
|
||||
null
|
||||
);
|
||||
|
||||
if (!bundler) {
|
||||
// TODO remove in a future version
|
||||
deprecate_dir('rollup');
|
||||
deprecate_dir('webpack');
|
||||
|
||||
throw new Error(`Could not find rollup.config.js or webpack.config.js`);
|
||||
}
|
||||
}
|
||||
|
||||
if (bundler !== 'rollup' && bundler !== 'webpack') {
|
||||
throw new Error(`'${bundler}' is not a valid option for --bundler — must be either 'rollup' or 'webpack'`);
|
||||
}
|
||||
|
||||
return bundler;
|
||||
}
|
||||
|
||||
function deprecate_dir(bundler: 'rollup' | 'webpack') {
|
||||
try {
|
||||
const stats = fs.statSync(bundler);
|
||||
if (!stats.isDirectory()) return;
|
||||
} catch (err) {
|
||||
// do nothing
|
||||
return;
|
||||
}
|
||||
|
||||
// TODO link to docs, once those docs exist
|
||||
throw new Error(`As of Sapper 0.21, build configuration should be placed in a single ${bundler}.config.js file`);
|
||||
}
|
||||
287
src/cli.ts
Executable file
287
src/cli.ts
Executable file
@@ -0,0 +1,287 @@
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
import sade from 'sade';
|
||||
import colors from 'kleur';
|
||||
import * as pkg from '../package.json';
|
||||
import { elapsed, repeat, left_pad, format_milliseconds } from './utils';
|
||||
import { InvalidEvent, ErrorEvent, FatalEvent, BuildEvent, ReadyEvent } from './interfaces';
|
||||
|
||||
const prog = sade('sapper').version(pkg.version);
|
||||
|
||||
if (process.argv[2] === 'start') {
|
||||
// remove this in a future version
|
||||
console.error(colors.bold().red(`'sapper start' has been removed`));
|
||||
console.error(`Use 'node [build_dir]' instead`);
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
const start = Date.now();
|
||||
|
||||
prog.command('dev')
|
||||
.describe('Start a development server')
|
||||
.option('-p, --port', 'Specify a port')
|
||||
.option('-o, --open', 'Open a browser window')
|
||||
.option('--dev-port', 'Specify a port for development server')
|
||||
.option('--hot', 'Use hot module replacement (requires webpack)', true)
|
||||
.option('--live', 'Reload on changes if not using --hot', true)
|
||||
.option('--bundler', 'Specify a bundler (rollup or webpack)')
|
||||
.option('--cwd', 'Current working directory', '.')
|
||||
.option('--src', 'Source directory', 'src')
|
||||
.option('--routes', 'Routes directory', 'src/routes')
|
||||
.option('--static', 'Static files directory', 'static')
|
||||
.option('--output', 'Sapper output directory', 'src/node_modules/@sapper')
|
||||
.option('--build-dir', 'Development build directory', '__sapper__/dev')
|
||||
.action(async (opts: {
|
||||
port: number,
|
||||
open: boolean,
|
||||
'dev-port': number,
|
||||
live: boolean,
|
||||
hot: boolean,
|
||||
bundler?: 'rollup' | 'webpack',
|
||||
cwd: string,
|
||||
src: string,
|
||||
routes: string,
|
||||
static: string,
|
||||
output: string,
|
||||
'build-dir': string
|
||||
}) => {
|
||||
const { dev } = await import('./api/dev');
|
||||
|
||||
try {
|
||||
const watcher = dev({
|
||||
cwd: opts.cwd,
|
||||
src: opts.src,
|
||||
routes: opts.routes,
|
||||
static: opts.static,
|
||||
output: opts.output,
|
||||
dest: opts['build-dir'],
|
||||
port: opts.port,
|
||||
'dev-port': opts['dev-port'],
|
||||
live: opts.live,
|
||||
hot: opts.hot,
|
||||
bundler: opts.bundler
|
||||
});
|
||||
|
||||
let first = true;
|
||||
|
||||
watcher.on('stdout', data => {
|
||||
process.stdout.write(data);
|
||||
});
|
||||
|
||||
watcher.on('stderr', data => {
|
||||
process.stderr.write(data);
|
||||
});
|
||||
|
||||
watcher.on('ready', async (event: ReadyEvent) => {
|
||||
if (first) {
|
||||
console.log(colors.bold().cyan(`> Listening on http://localhost:${event.port}`));
|
||||
if (opts.open) {
|
||||
const { exec } = await import('child_process');
|
||||
exec(`open http://localhost:${event.port}`);
|
||||
}
|
||||
first = false;
|
||||
}
|
||||
});
|
||||
|
||||
watcher.on('invalid', (event: InvalidEvent) => {
|
||||
const changed = event.changed.map(filename => path.relative(process.cwd(), filename)).join(', ');
|
||||
console.log(`\n${colors.bold().cyan(changed)} changed. rebuilding...`);
|
||||
});
|
||||
|
||||
watcher.on('error', (event: ErrorEvent) => {
|
||||
console.log(colors.red(`✗ ${event.type}`));
|
||||
console.log(colors.red(event.message));
|
||||
});
|
||||
|
||||
watcher.on('fatal', (event: FatalEvent) => {
|
||||
console.log(colors.bold().red(`> ${event.message}`));
|
||||
if (event.log) console.log(event.log);
|
||||
});
|
||||
|
||||
watcher.on('build', (event: BuildEvent) => {
|
||||
if (event.errors.length) {
|
||||
console.log(colors.bold().red(`✗ ${event.type}`));
|
||||
|
||||
event.errors.filter(e => !e.duplicate).forEach(error => {
|
||||
if (error.file) console.log(colors.bold()(error.file));
|
||||
console.log(error.message);
|
||||
});
|
||||
|
||||
const hidden = event.errors.filter(e => e.duplicate).length;
|
||||
if (hidden > 0) {
|
||||
console.log(`${hidden} duplicate ${hidden === 1 ? 'error' : 'errors'} hidden\n`);
|
||||
}
|
||||
} else if (event.warnings.length) {
|
||||
console.log(colors.bold().yellow(`• ${event.type}`));
|
||||
|
||||
event.warnings.filter(e => !e.duplicate).forEach(warning => {
|
||||
if (warning.file) console.log(colors.bold()(warning.file));
|
||||
console.log(warning.message);
|
||||
});
|
||||
|
||||
const hidden = event.warnings.filter(e => e.duplicate).length;
|
||||
if (hidden > 0) {
|
||||
console.log(`${hidden} duplicate ${hidden === 1 ? 'warning' : 'warnings'} hidden\n`);
|
||||
}
|
||||
} else {
|
||||
console.log(`${colors.bold().green(`✔ ${event.type}`)} ${colors.gray(`(${format_milliseconds(event.duration)})`)}`);
|
||||
}
|
||||
});
|
||||
} catch (err) {
|
||||
console.log(colors.bold().red(`> ${err.message}`));
|
||||
console.log(colors.gray(err.stack));
|
||||
process.exit(1);
|
||||
}
|
||||
});
|
||||
|
||||
prog.command('build [dest]')
|
||||
.describe('Create a production-ready version of your app')
|
||||
.option('-p, --port', 'Default of process.env.PORT', '3000')
|
||||
.option('--bundler', 'Specify a bundler (rollup or webpack, blank for auto)')
|
||||
.option('--legacy', 'Create separate legacy build')
|
||||
.option('--cwd', 'Current working directory', '.')
|
||||
.option('--src', 'Source directory', 'src')
|
||||
.option('--routes', 'Routes directory', 'src/routes')
|
||||
.option('--output', 'Sapper output directory', 'src/node_modules/@sapper')
|
||||
.example(`build custom-dir -p 4567`)
|
||||
.action(async (dest = '__sapper__/build', opts: {
|
||||
port: string,
|
||||
legacy: boolean,
|
||||
bundler?: 'rollup' | 'webpack',
|
||||
cwd: string,
|
||||
src: string,
|
||||
routes: string,
|
||||
output: string
|
||||
}) => {
|
||||
console.log(`> Building...`);
|
||||
|
||||
try {
|
||||
await _build(opts.bundler, opts.legacy, opts.cwd, opts.src, opts.routes, opts.output, dest);
|
||||
|
||||
const launcher = path.resolve(dest, 'index.js');
|
||||
|
||||
fs.writeFileSync(launcher, `
|
||||
// generated by sapper build at ${new Date().toISOString()}
|
||||
process.env.NODE_ENV = process.env.NODE_ENV || 'production';
|
||||
process.env.PORT = process.env.PORT || ${opts.port || 3000};
|
||||
|
||||
console.log('Starting server on port ' + process.env.PORT);
|
||||
require('./server/server.js');
|
||||
`.replace(/^\t+/gm, '').trim());
|
||||
|
||||
console.error(`\n> Finished in ${elapsed(start)}. Type ${colors.bold().cyan(`node ${dest}`)} to run the app.`);
|
||||
} catch (err) {
|
||||
console.log(`${colors.bold().red(`> ${err.message}`)}`);
|
||||
console.log(colors.gray(err.stack));
|
||||
process.exit(1);
|
||||
}
|
||||
});
|
||||
|
||||
prog.command('export [dest]')
|
||||
.describe('Export your app as static files (if possible)')
|
||||
.option('--build', '(Re)build app before exporting', true)
|
||||
.option('--basepath', 'Specify a base path')
|
||||
.option('--timeout', 'Milliseconds to wait for a page (--no-timeout to disable)', 5000)
|
||||
.option('--legacy', 'Create separate legacy build')
|
||||
.option('--bundler', 'Specify a bundler (rollup or webpack, blank for auto)')
|
||||
.option('--cwd', 'Current working directory', '.')
|
||||
.option('--src', 'Source directory', 'src')
|
||||
.option('--routes', 'Routes directory', 'src/routes')
|
||||
.option('--static', 'Static files directory', 'static')
|
||||
.option('--output', 'Sapper output directory', 'src/node_modules/@sapper')
|
||||
.option('--build-dir', 'Intermediate build directory', '__sapper__/build')
|
||||
.action(async (dest = '__sapper__/export', opts: {
|
||||
build: boolean,
|
||||
legacy: boolean,
|
||||
bundler?: 'rollup' | 'webpack',
|
||||
basepath?: string,
|
||||
timeout: number | false,
|
||||
cwd: string,
|
||||
src: string,
|
||||
routes: string,
|
||||
static: string,
|
||||
output: string,
|
||||
'build-dir': string,
|
||||
}) => {
|
||||
try {
|
||||
if (opts.build) {
|
||||
console.log(`> Building...`);
|
||||
await _build(opts.bundler, opts.legacy, opts.cwd, opts.src, opts.routes, opts.output, opts['build-dir']);
|
||||
console.error(`\n> Built in ${elapsed(start)}`);
|
||||
}
|
||||
|
||||
const { export: _export } = await import('./api/export');
|
||||
const { default: pb } = await import('pretty-bytes');
|
||||
|
||||
await _export({
|
||||
cwd: opts.cwd,
|
||||
static: opts.static,
|
||||
build_dir: opts['build-dir'],
|
||||
export_dir: dest,
|
||||
basepath: opts.basepath,
|
||||
timeout: opts.timeout,
|
||||
|
||||
oninfo: event => {
|
||||
console.log(colors.bold().cyan(`> ${event.message}`));
|
||||
},
|
||||
|
||||
onfile: event => {
|
||||
const size_color = event.size > 150000 ? colors.bold().red : event.size > 50000 ? colors.bold().yellow : colors.bold().gray;
|
||||
const size_label = size_color(left_pad(pb(event.size), 10));
|
||||
|
||||
const file_label = event.status === 200
|
||||
? event.file
|
||||
: colors.bold()[event.status >= 400 ? 'red' : 'yellow'](`(${event.status}) ${event.file}`);
|
||||
|
||||
console.log(`${size_label} ${file_label}`);
|
||||
}
|
||||
});
|
||||
|
||||
console.error(`\n> Finished in ${elapsed(start)}. Type ${colors.bold().cyan(`npx serve ${dest}`)} to run the app.`);
|
||||
} catch (err) {
|
||||
console.error(colors.bold().red(`> ${err.message}`));
|
||||
process.exit(1);
|
||||
}
|
||||
});
|
||||
|
||||
prog.parse(process.argv);
|
||||
|
||||
|
||||
async function _build(
|
||||
bundler: 'rollup' | 'webpack',
|
||||
legacy: boolean,
|
||||
cwd: string,
|
||||
src: string,
|
||||
routes: string,
|
||||
output: string,
|
||||
dest: string
|
||||
) {
|
||||
const { build } = await import('./api/build');
|
||||
|
||||
await build({
|
||||
bundler,
|
||||
legacy,
|
||||
cwd,
|
||||
src,
|
||||
routes,
|
||||
dest,
|
||||
|
||||
oncompile: event => {
|
||||
let banner = `built ${event.type}`;
|
||||
let c = colors.cyan;
|
||||
|
||||
const { warnings } = event.result;
|
||||
if (warnings.length > 0) {
|
||||
banner += ` with ${warnings.length} ${warnings.length === 1 ? 'warning' : 'warnings'}`;
|
||||
c = colors.yellow;
|
||||
}
|
||||
|
||||
console.log();
|
||||
console.log(c(`┌─${repeat('─', banner.length)}─┐`));
|
||||
console.log(c(`│ ${colors.bold(banner) } │`));
|
||||
console.log(c(`└─${repeat('─', banner.length)}─┘`));
|
||||
|
||||
console.log(event.result.print());
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -1,57 +0,0 @@
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
import mkdirp from 'mkdirp';
|
||||
import rimraf from 'rimraf';
|
||||
import { create_compilers, create_app, create_routes, create_serviceworker } from 'sapper/core.js';
|
||||
|
||||
export default async function build({ src, dest, dev, entry }: {
|
||||
src: string;
|
||||
dest: string;
|
||||
dev: boolean;
|
||||
entry: { client: string, server: string }
|
||||
}) {
|
||||
mkdirp.sync(dest);
|
||||
rimraf.sync(path.join(dest, '**/*'));
|
||||
|
||||
const routes = create_routes({ src });
|
||||
|
||||
// create app/manifest/client.js and app/manifest/server.js
|
||||
create_app({ routes, src, dev });
|
||||
|
||||
const { client, server, serviceworker } = create_compilers();
|
||||
|
||||
const client_stats = await compile(client);
|
||||
fs.writeFileSync(path.join(dest, 'client_info.json'), JSON.stringify(client_stats.toJson()));
|
||||
|
||||
await compile(server);
|
||||
|
||||
if (serviceworker) {
|
||||
create_serviceworker({
|
||||
routes,
|
||||
client_files: client_stats.toJson().assets.map((chunk: { name: string }) => `/client/${chunk.name}`),
|
||||
src
|
||||
});
|
||||
|
||||
await compile(serviceworker);
|
||||
}
|
||||
}
|
||||
|
||||
function compile(compiler: any) {
|
||||
return new Promise((fulfil, reject) => {
|
||||
compiler.run((err: Error, stats: any) => {
|
||||
if (err) {
|
||||
reject(err);
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
if (stats.hasErrors()) {
|
||||
console.error(stats.toString({ colors: true }));
|
||||
reject(new Error(`Encountered errors while building app`));
|
||||
}
|
||||
|
||||
else {
|
||||
fulfil(stats);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
229
src/cli/dev.ts
229
src/cli/dev.ts
@@ -1,229 +0,0 @@
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
import * as net from 'net';
|
||||
import * as chalk from 'chalk';
|
||||
import * as child_process from 'child_process';
|
||||
import * as http from 'http';
|
||||
import mkdirp from 'mkdirp';
|
||||
import rimraf from 'rimraf';
|
||||
import { wait_for_port } from './utils';
|
||||
import { create_compilers, create_app, create_routes, create_serviceworker, create_template } from 'sapper/core.js';
|
||||
|
||||
type Deferred = {
|
||||
promise?: Promise<any>;
|
||||
fulfil?: (value?: any) => void;
|
||||
reject?: (err: Error) => void;
|
||||
}
|
||||
|
||||
function deferred() {
|
||||
const d: Deferred = {};
|
||||
|
||||
d.promise = new Promise((fulfil, reject) => {
|
||||
d.fulfil = fulfil;
|
||||
d.reject = reject;
|
||||
});
|
||||
|
||||
return d;
|
||||
}
|
||||
|
||||
function create_hot_update_server(port: number, interval = 10000) {
|
||||
const clients = new Set();
|
||||
|
||||
const server = http.createServer((req, res) => {
|
||||
if (req.url !== '/hmr') return;
|
||||
|
||||
req.socket.setKeepAlive(true);
|
||||
res.writeHead(200, {
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
'Content-Type': 'text/event-stream;charset=utf-8',
|
||||
'Cache-Control': 'no-cache, no-transform',
|
||||
'Connection': 'keep-alive',
|
||||
// While behind nginx, event stream should not be buffered:
|
||||
// http://nginx.org/docs/http/ngx_http_proxy_module.html#proxy_buffering
|
||||
'X-Accel-Buffering': 'no'
|
||||
});
|
||||
|
||||
res.write('\n');
|
||||
|
||||
clients.add(res);
|
||||
req.on('close', () => {
|
||||
clients.delete(res);
|
||||
});
|
||||
});
|
||||
|
||||
server.listen(port);
|
||||
|
||||
function send(data: any) {
|
||||
clients.forEach(client => {
|
||||
client.write(`data: ${JSON.stringify(data)}\n\n`);
|
||||
});
|
||||
}
|
||||
|
||||
setInterval(() => {
|
||||
send(null)
|
||||
}, interval);
|
||||
|
||||
return { send };
|
||||
}
|
||||
|
||||
export default async function dev(src: string, dir: string) {
|
||||
rimraf.sync(dir);
|
||||
mkdirp.sync(dir);
|
||||
|
||||
const chokidar = require('chokidar');
|
||||
|
||||
// initial build
|
||||
const dev_port = await require('get-port')(10000);
|
||||
|
||||
const routes = create_routes({ src });
|
||||
create_app({ routes, src, dev: true, dev_port });
|
||||
|
||||
const hot_update_server = create_hot_update_server(dev_port);
|
||||
|
||||
// TODO watch the configs themselves?
|
||||
const compilers = create_compilers();
|
||||
|
||||
function watch_files(pattern: string, callback: () => void) {
|
||||
const watcher = chokidar.watch(pattern, {
|
||||
persistent: false
|
||||
});
|
||||
|
||||
watcher.on('add', callback);
|
||||
watcher.on('change', callback);
|
||||
watcher.on('unlink', callback);
|
||||
}
|
||||
|
||||
watch_files('routes/**/*.+(html|js|mjs)', () => {
|
||||
const routes = create_routes({ src });
|
||||
create_app({ routes, src, dev: true, dev_port });
|
||||
});
|
||||
|
||||
watch_files('app/template.html', () => {
|
||||
const template = create_template();
|
||||
// TODO reload current page?
|
||||
});
|
||||
|
||||
let proc: child_process.ChildProcess;
|
||||
|
||||
const deferreds = {
|
||||
server: deferred(),
|
||||
client: deferred()
|
||||
};
|
||||
|
||||
const times = {
|
||||
client_start: Date.now(),
|
||||
server_start: Date.now(),
|
||||
serviceworker_start: Date.now()
|
||||
};
|
||||
|
||||
compilers.server.plugin('invalid', () => {
|
||||
times.server_start = Date.now();
|
||||
// TODO print message
|
||||
deferreds.server = deferred();
|
||||
});
|
||||
|
||||
compilers.server.watch({}, (err: Error, stats: any) => {
|
||||
if (err) {
|
||||
console.error(chalk.red(err.message));
|
||||
} else if (stats.hasErrors()) {
|
||||
// print errors. TODO notify client
|
||||
stats.toJson().errors.forEach((error: Error) => {
|
||||
console.error(error); // TODO make this look nice
|
||||
});
|
||||
} else {
|
||||
console.log(`built server in ${Date.now() - times.server_start}ms`); // TODO prettify
|
||||
|
||||
const server_info = stats.toJson();
|
||||
fs.writeFileSync(path.join(dir, 'server_info.json'), JSON.stringify(server_info, null, ' '));
|
||||
|
||||
deferreds.client.promise.then(() => {
|
||||
function restart() {
|
||||
wait_for_port(3000, deferreds.server.fulfil); // TODO control port
|
||||
}
|
||||
|
||||
if (proc) {
|
||||
proc.kill();
|
||||
proc.on('exit', restart);
|
||||
} else {
|
||||
restart();
|
||||
}
|
||||
|
||||
proc = child_process.fork(`${dir}/server.js`, [], {
|
||||
cwd: process.cwd(),
|
||||
env: Object.assign({}, process.env)
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
compilers.client.plugin('invalid', (filename: string) => {
|
||||
times.client_start = Date.now();
|
||||
|
||||
deferreds.client = deferred();
|
||||
|
||||
// TODO we should delete old assets. due to a webpack bug
|
||||
// i don't even begin to comprehend, this is apparently
|
||||
// quite difficult
|
||||
});
|
||||
|
||||
compilers.client.watch({}, (err: Error, stats: any) => {
|
||||
if (err) {
|
||||
console.error(chalk.red(err.message));
|
||||
} else if (stats.hasErrors()) {
|
||||
// print errors. TODO notify client
|
||||
stats.toJson().errors.forEach((error: Error) => {
|
||||
console.error(error); // TODO make this look nice
|
||||
});
|
||||
} else {
|
||||
console.log(`built client in ${Date.now() - times.client_start}ms`); // TODO prettify
|
||||
|
||||
const client_info = stats.toJson();
|
||||
fs.writeFileSync(path.join(dir, 'client_info.json'), JSON.stringify(client_info, null, ' '));
|
||||
deferreds.client.fulfil();
|
||||
|
||||
const client_files = client_info.assets.map((chunk: { name: string }) => `/client/${chunk.name}`);
|
||||
|
||||
deferreds.server.promise.then(() => {
|
||||
hot_update_server.send({
|
||||
status: 'completed'
|
||||
});
|
||||
});
|
||||
|
||||
create_serviceworker({
|
||||
routes: create_routes({ src }),
|
||||
client_files,
|
||||
src
|
||||
});
|
||||
|
||||
watch_serviceworker();
|
||||
}
|
||||
});
|
||||
|
||||
let watch_serviceworker = compilers.serviceworker
|
||||
? function() {
|
||||
watch_serviceworker = noop;
|
||||
|
||||
compilers.serviceworker.plugin('invalid', (filename: string) => {
|
||||
times.serviceworker_start = Date.now();
|
||||
});
|
||||
|
||||
compilers.serviceworker.watch({}, (err: Error, stats: any) => {
|
||||
if (err) {
|
||||
// TODO notify client
|
||||
} else if (stats.hasErrors()) {
|
||||
// print errors. TODO notify client
|
||||
stats.toJson().errors.forEach((error: Error) => {
|
||||
console.error(error); // TODO make this look nice
|
||||
});
|
||||
} else {
|
||||
console.log(`built service worker in ${Date.now() - times.serviceworker_start}ms`); // TODO prettify
|
||||
|
||||
const serviceworker_info = stats.toJson();
|
||||
fs.writeFileSync(path.join(dir, 'serviceworker_info.json'), JSON.stringify(serviceworker_info, null, ' '));
|
||||
}
|
||||
});
|
||||
}
|
||||
: noop;
|
||||
}
|
||||
|
||||
function noop() {}
|
||||
@@ -1,91 +0,0 @@
|
||||
import * as child_process from 'child_process';
|
||||
import * as path from 'path';
|
||||
import * as sander from 'sander';
|
||||
import express from 'express';
|
||||
import cheerio from 'cheerio';
|
||||
import URL from 'url-parse';
|
||||
import fetch from 'node-fetch';
|
||||
import { wait_for_port } from './utils';
|
||||
|
||||
const { OUTPUT_DIR = 'dist' } = process.env;
|
||||
|
||||
const app = express();
|
||||
|
||||
function read_json(file: string) {
|
||||
return JSON.parse(sander.readFileSync(file, { encoding: 'utf-8' }));
|
||||
}
|
||||
|
||||
export default async function exporter(dir: string) { // dir === '.sapper'
|
||||
// Prep output directory
|
||||
sander.rimrafSync(OUTPUT_DIR);
|
||||
|
||||
sander.copydirSync('assets').to(OUTPUT_DIR);
|
||||
sander.copydirSync(dir, 'client').to(OUTPUT_DIR, 'client');
|
||||
sander.copyFileSync(dir, 'service-worker.js').to(OUTPUT_DIR, 'service-worker.js');
|
||||
|
||||
const port = await require('get-port')(3000);
|
||||
|
||||
const origin = `http://localhost:${port}`;
|
||||
|
||||
const proc = child_process.fork(path.resolve(`${dir}/server.js`), [], {
|
||||
cwd: process.cwd(),
|
||||
env: {
|
||||
PORT: port,
|
||||
NODE_ENV: 'production',
|
||||
SAPPER_EXPORT: 'true'
|
||||
}
|
||||
});
|
||||
|
||||
const seen = new Set();
|
||||
const saved = new Set();
|
||||
|
||||
proc.on('message', message => {
|
||||
if (!message.__sapper__) return;
|
||||
|
||||
const url = new URL(message.url, origin);
|
||||
|
||||
if (saved.has(url.pathname)) return;
|
||||
saved.add(url.pathname);
|
||||
|
||||
if (message.type === 'text/html') {
|
||||
const dest = `${OUTPUT_DIR}/${url.pathname}/index.html`;
|
||||
sander.writeFileSync(dest, message.body);
|
||||
} else {
|
||||
const dest = `${OUTPUT_DIR}/${url.pathname}`;
|
||||
sander.writeFileSync(dest, message.body);
|
||||
}
|
||||
});
|
||||
|
||||
function handle(url: URL) {
|
||||
if (url.origin !== origin) return;
|
||||
|
||||
if (seen.has(url.pathname)) return;
|
||||
seen.add(url.pathname);
|
||||
|
||||
return fetch(url.href)
|
||||
.then(r => {
|
||||
if (r.headers.get('Content-Type') === 'text/html') {
|
||||
return r.text().then((body: string) => {
|
||||
const $ = cheerio.load(body);
|
||||
const hrefs: string[] = [];
|
||||
|
||||
$('a[href]').each((i: number, $a) => {
|
||||
hrefs.push($a.attribs.href);
|
||||
});
|
||||
|
||||
return hrefs.reduce((promise, href) => {
|
||||
return promise.then(() => handle(new URL(href, url.href)));
|
||||
}, Promise.resolve());
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch((err: Error) => {
|
||||
console.error(`Error rendering ${url.pathname}: ${err.message}`);
|
||||
});
|
||||
}
|
||||
|
||||
wait_for_port(port, () => {
|
||||
handle(new URL(origin)) // TODO all static routes
|
||||
.then(() => proc.kill())
|
||||
});
|
||||
}
|
||||
@@ -1,20 +0,0 @@
|
||||
# sapper v<@version@>
|
||||
|
||||
https://sapper.svelte.technology
|
||||
|
||||
> sapper dev
|
||||
|
||||
Start a development server
|
||||
|
||||
> sapper build
|
||||
|
||||
Creates a production-ready version of your app
|
||||
|
||||
> sapper export
|
||||
|
||||
If possible, exports your app as static files, suitable for hosting on
|
||||
services like Netlify or Surge
|
||||
|
||||
> sapper --help
|
||||
|
||||
Shows this message
|
||||
@@ -1,57 +0,0 @@
|
||||
import mri from 'mri';
|
||||
import chalk from 'chalk';
|
||||
import help from './help.md';
|
||||
import build from './build';
|
||||
import exporter from './export';
|
||||
import dev from './dev';
|
||||
import upgrade from './upgrade';
|
||||
import { dest, entry, src } from '../config';
|
||||
import * as pkg from '../../package.json';
|
||||
|
||||
const opts = mri(process.argv.slice(2), {
|
||||
alias: {
|
||||
h: 'help'
|
||||
}
|
||||
});
|
||||
|
||||
if (opts.help) {
|
||||
const rendered = help
|
||||
.replace('<@version@>', pkg.version)
|
||||
.replace(/^(.+)/gm, (m: string, $1: string) => /[#>]/.test(m) ? $1 : ` ${$1}`)
|
||||
.replace(/^# (.+)/gm, (m: string, $1: string) => chalk.bold.underline($1))
|
||||
.replace(/^> (.+)/gm, (m: string, $1: string) => chalk.cyan($1));
|
||||
|
||||
console.log(`\n${rendered}\n`);
|
||||
process.exit(0);
|
||||
}
|
||||
|
||||
const [cmd] = opts._;
|
||||
|
||||
const start = Date.now();
|
||||
|
||||
if (cmd === 'build') {
|
||||
build({ dest, dev: false, entry, src })
|
||||
.then(() => {
|
||||
const elapsed = Date.now() - start;
|
||||
console.error(`built in ${elapsed}ms`); // TODO beautify this, e.g. 'built in 4.7 seconds'
|
||||
})
|
||||
.catch(err => {
|
||||
console.error(err ? err.details || err.stack || err.message || err : 'Unknown error');
|
||||
});
|
||||
} else if (cmd === 'export') {
|
||||
build({ dest, dev: false, entry, src })
|
||||
.then(() => exporter(dest))
|
||||
.then(() => {
|
||||
const elapsed = Date.now() - start;
|
||||
console.error(`extracted in ${elapsed}ms`); // TODO beautify this, e.g. 'built in 4.7 seconds'
|
||||
})
|
||||
.catch(err => {
|
||||
console.error(err ? err.details || err.stack || err.message || err : 'Unknown error');
|
||||
});
|
||||
} else if (cmd === 'dev') {
|
||||
dev(src, dest);
|
||||
} else if (cmd === 'upgrade') {
|
||||
upgrade();
|
||||
} else {
|
||||
console.log(`unrecognized command ${cmd} — try \`sapper --help\` for more information`);
|
||||
}
|
||||
@@ -1,53 +0,0 @@
|
||||
import * as fs from 'fs';
|
||||
import chalk from 'chalk';
|
||||
|
||||
export default async function upgrade() {
|
||||
const upgraded = [
|
||||
await upgrade_sapper_main()
|
||||
].filter(Boolean);
|
||||
|
||||
if (upgraded.length === 0) {
|
||||
console.log(`No changes!`);
|
||||
}
|
||||
}
|
||||
|
||||
async function upgrade_sapper_main() {
|
||||
const _2xx = read('templates/2xx.html');
|
||||
const _4xx = read('templates/4xx.html');
|
||||
const _5xx = read('templates/5xx.html');
|
||||
|
||||
const pattern = /<script src='\%sapper\.main\%'><\/script>/;
|
||||
|
||||
let replaced = false;
|
||||
|
||||
['2xx', '4xx', '5xx'].forEach(code => {
|
||||
const file = `templates/${code}.html`
|
||||
const template = read(file);
|
||||
if (!template) return;
|
||||
|
||||
if (/\%sapper\.main\%/.test(template)) {
|
||||
if (!pattern.test(template)) {
|
||||
console.log(chalk.red(`Could not replace %sapper.main% in ${file}`));
|
||||
} else {
|
||||
write(file, template.replace(pattern, `%sapper.scripts%`));
|
||||
console.log(chalk.green(`Replaced %sapper.main% in ${file}`));
|
||||
replaced = true;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
return replaced;
|
||||
}
|
||||
|
||||
function read(file: string) {
|
||||
try {
|
||||
return fs.readFileSync(file, 'utf-8');
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
function write(file: string, data: string) {
|
||||
fs.writeFileSync(file, data);
|
||||
}
|
||||
@@ -1,24 +0,0 @@
|
||||
import waitPort from 'wait-port';
|
||||
|
||||
export function wait_for_port(port: number, cb: () => void) {
|
||||
waitPort({ port }).then(cb);
|
||||
}
|
||||
|
||||
// import * as net from 'net';
|
||||
|
||||
// export function wait_for_port(port: number, cb: () => void) {
|
||||
// const socket = net.createConnection(port, 'localhost', () => {
|
||||
// cb();
|
||||
// socket.destroy();
|
||||
// });
|
||||
|
||||
// socket.on('error', err => {
|
||||
// setTimeout(() => {
|
||||
// wait_for_port(port, cb);
|
||||
// }, 100);
|
||||
// });
|
||||
|
||||
// setTimeout(() => {
|
||||
// socket.destroy();
|
||||
// }, 100);
|
||||
// }
|
||||
@@ -1,12 +0,0 @@
|
||||
import * as path from 'path';
|
||||
|
||||
export const isDev = () => process.env.NODE_ENV !== 'production';
|
||||
|
||||
export const templates = path.resolve(process.env.SAPPER_TEMPLATES || 'templates');
|
||||
export const src = path.resolve(process.env.SAPPER_ROUTES || 'routes');
|
||||
export const dest = path.resolve(process.env.SAPPER_DEST || '.sapper');
|
||||
|
||||
export const entry = {
|
||||
client: path.resolve(templates, '.main.rendered.js'),
|
||||
server: path.resolve(dest, 'server-entry.js')
|
||||
};
|
||||
7
src/config/env.ts
Normal file
7
src/config/env.ts
Normal file
@@ -0,0 +1,7 @@
|
||||
export let dev: boolean;
|
||||
export let src: string;
|
||||
export let dest: string;
|
||||
|
||||
export const set_dev = (_: boolean) => dev = _;
|
||||
export const set_src = (_: string) => src = _;
|
||||
export const set_dest = (_: string) => dest = _;
|
||||
53
src/config/rollup.ts
Normal file
53
src/config/rollup.ts
Normal file
@@ -0,0 +1,53 @@
|
||||
import { dev, src, dest } from './env';
|
||||
|
||||
export default {
|
||||
dev,
|
||||
|
||||
client: {
|
||||
input: () => {
|
||||
return `${src}/client.js`
|
||||
},
|
||||
|
||||
output: () => {
|
||||
let dir = `${dest}/client`;
|
||||
if (process.env.SAPPER_LEGACY_BUILD) dir += `/legacy`;
|
||||
|
||||
return {
|
||||
dir,
|
||||
entryFileNames: '[name].[hash].js',
|
||||
chunkFileNames: '[name].[hash].js',
|
||||
format: 'esm',
|
||||
sourcemap: dev
|
||||
};
|
||||
}
|
||||
},
|
||||
|
||||
server: {
|
||||
input: () => {
|
||||
return {
|
||||
server: `${src}/server.js`
|
||||
};
|
||||
},
|
||||
|
||||
output: () => {
|
||||
return {
|
||||
dir: `${dest}/server`,
|
||||
format: 'cjs',
|
||||
sourcemap: dev
|
||||
};
|
||||
}
|
||||
},
|
||||
|
||||
serviceworker: {
|
||||
input: () => {
|
||||
return `${src}/service-worker.js`;
|
||||
},
|
||||
|
||||
output: () => {
|
||||
return {
|
||||
file: `${dest}/service-worker.js`,
|
||||
format: 'iife'
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -1,17 +1,12 @@
|
||||
import { dest, isDev, entry } from '../config';
|
||||
import { dev, src, dest } from './env';
|
||||
|
||||
export default {
|
||||
dev: isDev(),
|
||||
dev,
|
||||
|
||||
client: {
|
||||
entry: () => {
|
||||
return {
|
||||
main: [
|
||||
'./app/client.js',
|
||||
// workaround for https://github.com/webpack-contrib/extract-text-webpack-plugin/issues/456
|
||||
'style-loader/lib/addStyles',
|
||||
'css-loader/lib/css-base'
|
||||
]
|
||||
main: `${src}/client`
|
||||
};
|
||||
},
|
||||
|
||||
@@ -20,7 +15,7 @@ export default {
|
||||
path: `${dest}/client`,
|
||||
filename: '[hash]/[name].js',
|
||||
chunkFilename: '[hash]/[name].[id].js',
|
||||
publicPath: '/client/'
|
||||
publicPath: `client/`
|
||||
};
|
||||
}
|
||||
},
|
||||
@@ -28,17 +23,33 @@ export default {
|
||||
server: {
|
||||
entry: () => {
|
||||
return {
|
||||
server: './app/server.js'
|
||||
server: `${src}/server`
|
||||
};
|
||||
},
|
||||
|
||||
output: () => {
|
||||
return {
|
||||
path: `${dest}`,
|
||||
path: `${dest}/server`,
|
||||
filename: '[name].js',
|
||||
chunkFilename: '[hash]/[name].[id].js',
|
||||
libraryTarget: 'commonjs2'
|
||||
};
|
||||
}
|
||||
},
|
||||
|
||||
serviceworker: {
|
||||
entry: () => {
|
||||
return {
|
||||
'service-worker': `${src}/service-worker`
|
||||
};
|
||||
},
|
||||
|
||||
output: () => {
|
||||
return {
|
||||
path: dest,
|
||||
filename: '[name].js',
|
||||
chunkFilename: '[name].[id].[hash].js'
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
3
src/core.ts
Normal file
3
src/core.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
export * from './core/create_manifests';
|
||||
export { default as create_compilers } from './core/create_compilers/index';
|
||||
export { default as create_manifest_data } from './core/create_manifest_data';
|
||||
@@ -1,91 +0,0 @@
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
import mkdirp from 'mkdirp';
|
||||
import create_routes from './create_routes';
|
||||
import { fudge_mtime, posixify, write } from './utils';
|
||||
import { Route } from '../interfaces';
|
||||
|
||||
export default function create_app({ routes, src, dev, dev_port }: {
|
||||
routes: Route[];
|
||||
src: string;
|
||||
dev: boolean;
|
||||
dev_port: number;
|
||||
}) {
|
||||
mkdirp.sync('app/manifest');
|
||||
|
||||
write('app/manifest/client.js', generate_client(routes, src, dev, dev_port));
|
||||
write('app/manifest/server.js', generate_server(routes, src));
|
||||
}
|
||||
|
||||
function generate_client(routes: Route[], src: string, dev: boolean, dev_port?: number) {
|
||||
let code = `
|
||||
// This file is generated by Sapper — do not edit it!
|
||||
export const routes = [
|
||||
${routes
|
||||
.filter(route => route.type === 'page')
|
||||
.map(route => {
|
||||
const file = posixify(`../../routes/${route.file}`);
|
||||
|
||||
if (route.id === '_4xx' || route.id === '_5xx') {
|
||||
return `{ error: '${route.id.slice(1)}', load: () => import(/* webpackChunkName: "${route.id}" */ '${file}') }`;
|
||||
}
|
||||
|
||||
const params = route.dynamic.length === 0
|
||||
? '{}'
|
||||
: `{ ${route.dynamic.map((part, i) => `${part}: match[${i + 1}]`).join(', ')} }`;
|
||||
|
||||
return `{ pattern: ${route.pattern}, params: ${route.dynamic.length > 0 ? `match` : `()`} => (${params}), load: () => import(/* webpackChunkName: "${route.id}" */ '${file}') }`;
|
||||
})
|
||||
.join(',\n\t')}
|
||||
];`.replace(/^\t\t/gm, '').trim();
|
||||
|
||||
if (dev) {
|
||||
const hmr_client = posixify(
|
||||
path.resolve(__dirname, 'hmr-client.js')
|
||||
);
|
||||
|
||||
code += `
|
||||
|
||||
if (module.hot) {
|
||||
import('${hmr_client}').then(client => {
|
||||
client.connect(${dev_port});
|
||||
});
|
||||
}`.replace(/^\t{3}/gm, '');
|
||||
}
|
||||
|
||||
return code;
|
||||
}
|
||||
|
||||
function generate_server(routes: Route[], src: string) {
|
||||
let code = `
|
||||
// This file is generated by Sapper — do not edit it!
|
||||
${routes
|
||||
.map(route => {
|
||||
const file = posixify(`../../routes/${route.file}`);
|
||||
return route.type === 'page'
|
||||
? `import ${route.id} from '${file}';`
|
||||
: `import * as ${route.id} from '${file}';`;
|
||||
})
|
||||
.join('\n')}
|
||||
|
||||
export const routes = [
|
||||
${routes
|
||||
.map(route => {
|
||||
const file = posixify(`${src}/${route.file}`);
|
||||
|
||||
if (route.id === '_4xx' || route.id === '_5xx') {
|
||||
return `{ error: '${route.id.slice(1)}', module: ${route.id} }`;
|
||||
}
|
||||
|
||||
const params = route.dynamic.length === 0
|
||||
? '{}'
|
||||
: `{ ${route.dynamic.map((part, i) => `${part}: match[${i + 1}]`).join(', ')} }`;
|
||||
|
||||
return `{ id: '${route.id}', type: '${route.type}', pattern: ${route.pattern}, params: ${route.dynamic.length > 0 ? `match` : `()`} => (${params}), module: ${route.id} }`;
|
||||
})
|
||||
.join(',\n\t')
|
||||
}
|
||||
];`.replace(/^\t\t/gm, '').trim();
|
||||
|
||||
return code;
|
||||
}
|
||||
@@ -1,29 +0,0 @@
|
||||
import * as path from 'path';
|
||||
import relative from 'require-relative';
|
||||
|
||||
export default function create_compilers() {
|
||||
const webpack = relative('webpack', process.cwd());
|
||||
|
||||
const serviceworker_config = try_require(path.resolve('webpack/service-worker.config.js'));
|
||||
|
||||
return {
|
||||
client: webpack(
|
||||
require(path.resolve('webpack/client.config.js'))
|
||||
),
|
||||
|
||||
server: webpack(
|
||||
require(path.resolve('webpack/server.config.js'))
|
||||
),
|
||||
|
||||
serviceworker: serviceworker_config && webpack(serviceworker_config)
|
||||
};
|
||||
}
|
||||
|
||||
function try_require(specifier: string) {
|
||||
try {
|
||||
return require(specifier);
|
||||
} catch (err) {
|
||||
if (err.code === 'MODULE_NOT_FOUND') return null;
|
||||
throw err;
|
||||
}
|
||||
}
|
||||
169
src/core/create_compilers/RollupCompiler.ts
Normal file
169
src/core/create_compilers/RollupCompiler.ts
Normal file
@@ -0,0 +1,169 @@
|
||||
import * as path from 'path';
|
||||
import relative from 'require-relative';
|
||||
import { CompileResult } from './interfaces';
|
||||
import RollupResult from './RollupResult';
|
||||
|
||||
let rollup: any;
|
||||
|
||||
export default class RollupCompiler {
|
||||
_: Promise<any>;
|
||||
_oninvalid: (filename: string) => void;
|
||||
_start: number;
|
||||
input: string;
|
||||
warnings: any[];
|
||||
errors: any[];
|
||||
chunks: any[];
|
||||
css_files: Array<{ id: string, code: string }>;
|
||||
|
||||
constructor(config: any) {
|
||||
this._ = this.get_config(config);
|
||||
this.input = null;
|
||||
this.warnings = [];
|
||||
this.errors = [];
|
||||
this.chunks = [];
|
||||
this.css_files = [];
|
||||
}
|
||||
|
||||
async get_config(mod: any) {
|
||||
// TODO this is hacky, and doesn't need to apply to all three compilers
|
||||
(mod.plugins || (mod.plugins = [])).push({
|
||||
name: 'sapper-internal',
|
||||
options: (opts: any) => {
|
||||
this.input = opts.input;
|
||||
},
|
||||
renderChunk: (code: string, chunk: any) => {
|
||||
this.chunks.push(chunk);
|
||||
},
|
||||
transform: (code: string, id: string) => {
|
||||
if (/\.css$/.test(id)) {
|
||||
this.css_files.push({ id, code });
|
||||
return ``;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const onwarn = mod.onwarn || ((warning: any, handler: (warning: any) => void) => {
|
||||
handler(warning);
|
||||
});
|
||||
|
||||
mod.onwarn = (warning: any) => {
|
||||
onwarn(warning, (warning: any) => {
|
||||
this.warnings.push(warning);
|
||||
});
|
||||
};
|
||||
|
||||
return mod;
|
||||
}
|
||||
|
||||
oninvalid(cb: (filename: string) => void) {
|
||||
this._oninvalid = cb;
|
||||
}
|
||||
|
||||
async compile(): Promise<CompileResult> {
|
||||
const config = await this._;
|
||||
|
||||
const start = Date.now();
|
||||
|
||||
try {
|
||||
const bundle = await rollup.rollup(config);
|
||||
await bundle.write(config.output);
|
||||
|
||||
return new RollupResult(Date.now() - start, this);
|
||||
} catch (err) {
|
||||
if (err.filename) {
|
||||
// TODO this is a bit messy. Also, can
|
||||
// Rollup emit other kinds of error?
|
||||
err.message = [
|
||||
`Failed to build — error in ${err.filename}: ${err.message}`,
|
||||
err.frame
|
||||
].filter(Boolean).join('\n');
|
||||
}
|
||||
|
||||
throw err;
|
||||
}
|
||||
}
|
||||
|
||||
async watch(cb: (err?: Error, stats?: any) => void) {
|
||||
const config = await this._;
|
||||
|
||||
const watcher = rollup.watch(config);
|
||||
|
||||
watcher.on('change', (id: string) => {
|
||||
this.chunks = [];
|
||||
this.warnings = [];
|
||||
this.errors = [];
|
||||
this._oninvalid(id);
|
||||
});
|
||||
|
||||
watcher.on('event', (event: any) => {
|
||||
switch (event.code) {
|
||||
case 'FATAL':
|
||||
// TODO kill the process?
|
||||
if (event.error.filename) {
|
||||
// TODO this is a bit messy. Also, can
|
||||
// Rollup emit other kinds of error?
|
||||
event.error.message = [
|
||||
`Failed to build — error in ${event.error.filename}: ${event.error.message}`,
|
||||
event.error.frame
|
||||
].filter(Boolean).join('\n');
|
||||
}
|
||||
|
||||
cb(event.error);
|
||||
break;
|
||||
|
||||
case 'ERROR':
|
||||
this.errors.push(event.error);
|
||||
cb(null, new RollupResult(Date.now() - this._start, this));
|
||||
break;
|
||||
|
||||
case 'START':
|
||||
case 'END':
|
||||
// TODO is there anything to do with this info?
|
||||
break;
|
||||
|
||||
case 'BUNDLE_START':
|
||||
this._start = Date.now();
|
||||
break;
|
||||
|
||||
case 'BUNDLE_END':
|
||||
cb(null, new RollupResult(Date.now() - this._start, this));
|
||||
break;
|
||||
|
||||
default:
|
||||
console.log(`Unexpected event ${event.code}`);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
static async load_config(cwd: string) {
|
||||
if (!rollup) rollup = relative('rollup', cwd);
|
||||
|
||||
const input = path.resolve(cwd, 'rollup.config.js');
|
||||
|
||||
const bundle = await rollup.rollup({
|
||||
input,
|
||||
inlineDynamicImports: true,
|
||||
external: (id: string) => {
|
||||
return (id[0] !== '.' && !path.isAbsolute(id)) || id.slice(-5, id.length) === '.json';
|
||||
}
|
||||
});
|
||||
|
||||
const resp = await bundle.generate({ format: 'cjs' });
|
||||
const { code } = resp.output ? resp.output[0] : resp;
|
||||
|
||||
// temporarily override require
|
||||
const defaultLoader = require.extensions['.js'];
|
||||
require.extensions['.js'] = (module: any, filename: string) => {
|
||||
if (filename === input) {
|
||||
module._compile(code, filename);
|
||||
} else {
|
||||
defaultLoader(module, filename);
|
||||
}
|
||||
};
|
||||
|
||||
const config: any = require(input);
|
||||
delete require.cache[input];
|
||||
|
||||
return config;
|
||||
}
|
||||
}
|
||||
119
src/core/create_compilers/RollupResult.ts
Normal file
119
src/core/create_compilers/RollupResult.ts
Normal file
@@ -0,0 +1,119 @@
|
||||
import * as path from 'path';
|
||||
import colors from 'kleur';
|
||||
import pb from 'pretty-bytes';
|
||||
import RollupCompiler from './RollupCompiler';
|
||||
import extract_css from './extract_css';
|
||||
import { left_pad } from '../../utils';
|
||||
import { CompileResult, BuildInfo, CompileError, Chunk, CssFile } from './interfaces';
|
||||
import { ManifestData, Dirs } from '../../interfaces';
|
||||
|
||||
export default class RollupResult implements CompileResult {
|
||||
duration: number;
|
||||
errors: CompileError[];
|
||||
warnings: CompileError[];
|
||||
chunks: Chunk[];
|
||||
assets: Record<string, string>;
|
||||
css_files: CssFile[];
|
||||
css: {
|
||||
main: string,
|
||||
chunks: Record<string, string[]>
|
||||
};
|
||||
summary: string;
|
||||
|
||||
constructor(duration: number, compiler: RollupCompiler) {
|
||||
this.duration = duration;
|
||||
|
||||
this.errors = compiler.errors.map(munge_warning_or_error);
|
||||
this.warnings = compiler.warnings.map(munge_warning_or_error); // TODO emit this as they happen
|
||||
|
||||
this.chunks = compiler.chunks.map(chunk => ({
|
||||
file: chunk.fileName,
|
||||
imports: chunk.imports.filter(Boolean),
|
||||
modules: Object.keys(chunk.modules)
|
||||
}));
|
||||
|
||||
this.css_files = compiler.css_files;
|
||||
|
||||
// TODO populate this properly. We don't have named chunks, as in
|
||||
// webpack, but we can have a route -> [chunk] map or something
|
||||
this.assets = {};
|
||||
|
||||
if (typeof compiler.input === 'string') {
|
||||
compiler.chunks.forEach(chunk => {
|
||||
if (compiler.input in chunk.modules) {
|
||||
this.assets.main = chunk.fileName;
|
||||
}
|
||||
});
|
||||
} else {
|
||||
for (const name in compiler.input) {
|
||||
const file = compiler.input[name];
|
||||
const chunk = compiler.chunks.find(chunk => file in chunk.modules);
|
||||
if (chunk) this.assets[name] = chunk.fileName;
|
||||
}
|
||||
}
|
||||
|
||||
this.summary = compiler.chunks.map(chunk => {
|
||||
const size_color = chunk.code.length > 150000 ? colors.bold().red : chunk.code.length > 50000 ? colors.bold().yellow : colors.bold().white;
|
||||
const size_label = left_pad(pb(chunk.code.length), 10);
|
||||
|
||||
const lines = [size_color(`${size_label} ${chunk.fileName}`)];
|
||||
|
||||
const deps = Object.keys(chunk.modules)
|
||||
.map(file => {
|
||||
return {
|
||||
file: path.relative(process.cwd(), file),
|
||||
size: chunk.modules[file].renderedLength
|
||||
};
|
||||
})
|
||||
.filter(dep => dep.size > 0)
|
||||
.sort((a, b) => b.size - a.size);
|
||||
|
||||
const total_unminified = deps.reduce((t, d) => t + d.size, 0);
|
||||
|
||||
deps.forEach((dep, i) => {
|
||||
const c = i === deps.length - 1 ? '└' : '│';
|
||||
let line = ` ${c} ${dep.file}`;
|
||||
|
||||
if (deps.length > 1) {
|
||||
const p = (100 * dep.size / total_unminified).toFixed(1);
|
||||
line += ` (${p}%)`;
|
||||
}
|
||||
|
||||
lines.push(colors.gray(line));
|
||||
});
|
||||
|
||||
return lines.join('\n');
|
||||
}).join('\n');
|
||||
}
|
||||
|
||||
to_json(manifest_data: ManifestData, dirs: Dirs): BuildInfo {
|
||||
// TODO extract_css has side-effects that don't belong
|
||||
// in a method called to_json
|
||||
return {
|
||||
bundler: 'rollup',
|
||||
shimport: require('shimport/package.json').version,
|
||||
assets: this.assets,
|
||||
css: extract_css(this, manifest_data.components, dirs)
|
||||
};
|
||||
}
|
||||
|
||||
print() {
|
||||
const blocks: string[] = this.warnings.map(warning => {
|
||||
return warning.file
|
||||
? `> ${colors.bold(warning.file)}\n${warning.message}`
|
||||
: `> ${warning.message}`;
|
||||
});
|
||||
|
||||
blocks.push(this.summary);
|
||||
|
||||
return blocks.join('\n\n');
|
||||
}
|
||||
}
|
||||
|
||||
function munge_warning_or_error(warning_or_error: any) {
|
||||
return {
|
||||
file: warning_or_error.filename,
|
||||
message: [warning_or_error.message, warning_or_error.frame].filter(Boolean).join('\n')
|
||||
};
|
||||
}
|
||||
|
||||
46
src/core/create_compilers/WebpackCompiler.ts
Normal file
46
src/core/create_compilers/WebpackCompiler.ts
Normal file
@@ -0,0 +1,46 @@
|
||||
import relative from 'require-relative';
|
||||
import { CompileResult } from './interfaces';
|
||||
import WebpackResult from './WebpackResult';
|
||||
|
||||
let webpack: any;
|
||||
|
||||
export class WebpackCompiler {
|
||||
_: any;
|
||||
|
||||
constructor(config: any) {
|
||||
if (!webpack) webpack = relative('webpack', process.cwd());
|
||||
this._ = webpack(config);
|
||||
}
|
||||
|
||||
oninvalid(cb: (filename: string) => void) {
|
||||
this._.hooks.invalid.tap('sapper', cb);
|
||||
}
|
||||
|
||||
compile(): Promise<CompileResult> {
|
||||
return new Promise((fulfil, reject) => {
|
||||
this._.run((err: Error, stats: any) => {
|
||||
if (err) {
|
||||
reject(err);
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
const result = new WebpackResult(stats);
|
||||
|
||||
if (result.errors.length) {
|
||||
console.error(stats.toString({ colors: true }));
|
||||
reject(new Error(`Encountered errors while building app`));
|
||||
}
|
||||
|
||||
else {
|
||||
fulfil(result);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
watch(cb: (err?: Error, stats?: any) => void) {
|
||||
this._.watch({}, (err?: Error, stats?: any) => {
|
||||
cb(err, stats && new WebpackResult(stats));
|
||||
});
|
||||
}
|
||||
}
|
||||
84
src/core/create_compilers/WebpackResult.ts
Normal file
84
src/core/create_compilers/WebpackResult.ts
Normal file
@@ -0,0 +1,84 @@
|
||||
import format_messages from 'webpack-format-messages';
|
||||
import { CompileResult, BuildInfo, CompileError, Chunk, CssFile } from './interfaces';
|
||||
import { ManifestData, Dirs } from '../../interfaces';
|
||||
|
||||
const locPattern = /\((\d+):(\d+)\)$/;
|
||||
|
||||
function munge_warning_or_error(message: string) {
|
||||
// TODO this is all a bit rube goldberg...
|
||||
const lines = message.split('\n');
|
||||
|
||||
const file = lines.shift()
|
||||
.replace('[7m', '') // careful — there is a special character at the beginning of this string
|
||||
.replace('[27m', '')
|
||||
.replace('./', '');
|
||||
|
||||
let line = null;
|
||||
let column = null;
|
||||
|
||||
const match = locPattern.exec(lines[0]);
|
||||
if (match) {
|
||||
lines[0] = lines[0].replace(locPattern, '');
|
||||
line = +match[1];
|
||||
column = +match[2];
|
||||
}
|
||||
|
||||
return {
|
||||
file,
|
||||
message: lines.join('\n')
|
||||
};
|
||||
}
|
||||
|
||||
export default class WebpackResult implements CompileResult {
|
||||
duration: number;
|
||||
errors: CompileError[];
|
||||
warnings: CompileError[];
|
||||
chunks: Chunk[];
|
||||
assets: Record<string, string>;
|
||||
css_files: CssFile[];
|
||||
stats: any;
|
||||
|
||||
constructor(stats: any) {
|
||||
this.stats = stats;
|
||||
|
||||
const info = stats.toJson();
|
||||
|
||||
const messages = format_messages(stats);
|
||||
|
||||
this.errors = messages.errors.map(munge_warning_or_error);
|
||||
this.warnings = messages.warnings.map(munge_warning_or_error);
|
||||
|
||||
this.duration = info.time;
|
||||
|
||||
this.chunks = info.assets.map((chunk: { name: string }) => ({ file: chunk.name }));
|
||||
this.assets = info.assetsByChunkName;
|
||||
}
|
||||
|
||||
to_json(manifest_data: ManifestData, dirs: Dirs): BuildInfo {
|
||||
const extract_css = (assets: string[] | string) => {
|
||||
assets = Array.isArray(assets) ? assets : [assets];
|
||||
return assets.find(asset => /\.css$/.test(asset));
|
||||
};
|
||||
|
||||
return {
|
||||
bundler: 'webpack',
|
||||
shimport: null, // webpack has its own loader
|
||||
assets: this.assets,
|
||||
css: {
|
||||
main: extract_css(this.assets.main),
|
||||
chunks: Object
|
||||
.keys(this.assets)
|
||||
.filter(chunkName => chunkName !== 'main')
|
||||
.reduce((chunks: { [key: string]: string }, chukName) => {
|
||||
const assets = this.assets[chukName];
|
||||
chunks[chukName] = extract_css(assets);
|
||||
return chunks;
|
||||
}, {})
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
print() {
|
||||
return this.stats.toString({ colors: true });
|
||||
}
|
||||
}
|
||||
248
src/core/create_compilers/extract_css.ts
Normal file
248
src/core/create_compilers/extract_css.ts
Normal file
@@ -0,0 +1,248 @@
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
import hash from 'string-hash';
|
||||
import * as codec from 'sourcemap-codec';
|
||||
import { PageComponent, Dirs } from '../../interfaces';
|
||||
import { CompileResult, Chunk } from './interfaces';
|
||||
import { posixify } from '../../utils'
|
||||
|
||||
const inline_sourcemap_header = 'data:application/json;charset=utf-8;base64,';
|
||||
|
||||
function extract_sourcemap(raw: string, id: string) {
|
||||
let raw_map: string;
|
||||
let map = null;
|
||||
|
||||
const code = raw.replace(/\/\*#\s+sourceMappingURL=(.+)\s+\*\//g, (m, url) => {
|
||||
if (raw_map) {
|
||||
// TODO should not happen!
|
||||
throw new Error(`Found multiple sourcemaps in single CSS file (${id})`);
|
||||
}
|
||||
|
||||
raw_map = url;
|
||||
return '';
|
||||
}).trim();
|
||||
|
||||
if (raw_map) {
|
||||
if (raw_map.startsWith(inline_sourcemap_header)) {
|
||||
const json = Buffer.from(raw_map.slice(inline_sourcemap_header.length), 'base64').toString();
|
||||
map = JSON.parse(json);
|
||||
} else {
|
||||
// TODO do we want to handle non-inline sourcemaps? could be a rabbit hole
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
code,
|
||||
map
|
||||
};
|
||||
}
|
||||
|
||||
type SourceMap = {
|
||||
version: 3;
|
||||
file: string;
|
||||
sources: string[];
|
||||
sourcesContent: string[];
|
||||
names: string[];
|
||||
mappings: string;
|
||||
};
|
||||
|
||||
function get_css_from_modules(modules: string[], css_map: Map<string, string>, dirs: Dirs) {
|
||||
const parts: string[] = [];
|
||||
const mappings: number[][][] = [];
|
||||
|
||||
const combined_map: SourceMap = {
|
||||
version: 3,
|
||||
file: null,
|
||||
sources: [],
|
||||
sourcesContent: [],
|
||||
names: [],
|
||||
mappings: null
|
||||
};
|
||||
|
||||
modules.forEach(module => {
|
||||
if (!/\.css$/.test(module)) return;
|
||||
|
||||
const css = css_map.get(module);
|
||||
|
||||
const { code, map } = extract_sourcemap(css, module);
|
||||
|
||||
parts.push(code);
|
||||
|
||||
if (map) {
|
||||
const lines = codec.decode(map.mappings);
|
||||
|
||||
if (combined_map.sources.length > 0 || combined_map.names.length > 0) {
|
||||
lines.forEach(line => {
|
||||
line.forEach(segment => {
|
||||
// adjust source index
|
||||
segment[1] += combined_map.sources.length;
|
||||
|
||||
// adjust name index
|
||||
if (segment[4]) segment[4] += combined_map.names.length;
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
combined_map.sources.push(...map.sources);
|
||||
combined_map.sourcesContent.push(...map.sourcesContent);
|
||||
combined_map.names.push(...map.names);
|
||||
|
||||
mappings.push(...lines);
|
||||
}
|
||||
});
|
||||
|
||||
if (parts.length > 0) {
|
||||
combined_map.mappings = codec.encode(mappings);
|
||||
|
||||
combined_map.sources = combined_map.sources.map(source => path.relative(`${dirs.dest}/client`, source));
|
||||
|
||||
return {
|
||||
code: parts.join('\n'),
|
||||
map: combined_map
|
||||
};
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
export default function extract_css(client_result: CompileResult, components: PageComponent[], dirs: Dirs) {
|
||||
const result: {
|
||||
main: string | null;
|
||||
chunks: Record<string, string[]>
|
||||
} = {
|
||||
main: null,
|
||||
chunks: {}
|
||||
};
|
||||
|
||||
if (!client_result.css_files) return; // Rollup-only for now
|
||||
|
||||
let asset_dir = `${dirs.dest}/client`;
|
||||
if (process.env.SAPPER_LEGACY_BUILD) asset_dir += '/legacy';
|
||||
|
||||
const unclaimed = new Set(client_result.css_files.map(x => x.id));
|
||||
|
||||
const lookup = new Map();
|
||||
client_result.chunks.forEach(chunk => {
|
||||
lookup.set(chunk.file, chunk);
|
||||
});
|
||||
|
||||
const css_map = new Map();
|
||||
client_result.css_files.forEach(css_module => {
|
||||
css_map.set(css_module.id, css_module.code);
|
||||
});
|
||||
|
||||
const chunks_with_css = new Set();
|
||||
|
||||
// concatenate and emit CSS
|
||||
client_result.chunks.forEach(chunk => {
|
||||
const css_modules = chunk.modules.filter(m => css_map.has(m));
|
||||
if (!css_modules.length) return;
|
||||
|
||||
const css = get_css_from_modules(css_modules, css_map, dirs);
|
||||
|
||||
const { code, map } = css;
|
||||
|
||||
const output_file_name = chunk.file.replace(/\.js$/, '.css');
|
||||
|
||||
map.file = output_file_name;
|
||||
map.sources = map.sources.map(source => path.relative(`${asset_dir}`, source));
|
||||
|
||||
fs.writeFileSync(`${asset_dir}/${output_file_name}`, `${code}\n/* sourceMappingURL=./${output_file_name}.map */`);
|
||||
fs.writeFileSync(`${asset_dir}/${output_file_name}.map`, JSON.stringify(map, null, ' '));
|
||||
|
||||
chunks_with_css.add(chunk);
|
||||
});
|
||||
|
||||
const entry = path.resolve(dirs.src, 'app.mjs');
|
||||
const entry_chunk = client_result.chunks.find(chunk => chunk.modules.indexOf(entry) !== -1);
|
||||
|
||||
const entry_chunk_dependencies: Set<Chunk> = new Set([entry_chunk]);
|
||||
const entry_css_modules: string[] = [];
|
||||
|
||||
// recursively find the chunks this component depends on
|
||||
entry_chunk_dependencies.forEach(chunk => {
|
||||
if (!chunk) return; // TODO why does this happen?
|
||||
|
||||
chunk.imports.forEach(file => {
|
||||
entry_chunk_dependencies.add(lookup.get(file));
|
||||
});
|
||||
|
||||
if (chunks_with_css.has(chunk)) {
|
||||
chunk.modules.forEach(file => {
|
||||
unclaimed.delete(file);
|
||||
if (css_map.has(file)) {
|
||||
entry_css_modules.push(file);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// figure out which (css-having) chunks each component depends on
|
||||
components.forEach(component => {
|
||||
const resolved = path.resolve(dirs.routes, component.file);
|
||||
const chunk: Chunk = client_result.chunks.find(chunk => chunk.modules.indexOf(resolved) !== -1);
|
||||
|
||||
if (!chunk) {
|
||||
// this should never happen!
|
||||
return;
|
||||
// throw new Error(`Could not find chunk that owns ${component.file}`);
|
||||
}
|
||||
|
||||
const chunk_dependencies: Set<Chunk> = new Set([chunk]);
|
||||
const css_dependencies: string[] = [];
|
||||
|
||||
// recursively find the chunks this component depends on
|
||||
chunk_dependencies.forEach(chunk => {
|
||||
if (!chunk) return; // TODO why does this happen?
|
||||
|
||||
chunk.imports.forEach(file => {
|
||||
chunk_dependencies.add(lookup.get(file));
|
||||
});
|
||||
|
||||
if (chunks_with_css.has(chunk)) {
|
||||
css_dependencies.push(chunk.file.replace(/\.js$/, '.css'));
|
||||
|
||||
chunk.modules.forEach(file => {
|
||||
unclaimed.delete(file);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
result.chunks[component.file] = css_dependencies;
|
||||
});
|
||||
|
||||
fs.readdirSync(asset_dir).forEach(file => {
|
||||
if (fs.statSync(`${asset_dir}/${file}`).isDirectory()) return;
|
||||
|
||||
const source = fs.readFileSync(`${asset_dir}/${file}`, 'utf-8');
|
||||
|
||||
const replaced = source.replace(/["']__SAPPER_CSS_PLACEHOLDER:(.+?)__["']/g, (m, route) => {
|
||||
return JSON.stringify(result.chunks[route]);
|
||||
});
|
||||
|
||||
fs.writeFileSync(`${asset_dir}/${file}`, replaced);
|
||||
});
|
||||
|
||||
unclaimed.forEach(file => {
|
||||
entry_css_modules.push(file);
|
||||
});
|
||||
|
||||
const leftover = get_css_from_modules(entry_css_modules, css_map, dirs);
|
||||
if (leftover) {
|
||||
const { code, map } = leftover;
|
||||
|
||||
const main_hash = hash(code);
|
||||
|
||||
const output_file_name = `main.${main_hash}.css`;
|
||||
|
||||
map.file = output_file_name;
|
||||
map.sources = map.sources.map(source => path.relative(asset_dir, source));
|
||||
|
||||
fs.writeFileSync(`${asset_dir}/${output_file_name}`, `${code}\n/* sourceMappingURL=client/${output_file_name}.map */`);
|
||||
fs.writeFileSync(`${asset_dir}/${output_file_name}.map`, JSON.stringify(map, null, ' '));
|
||||
|
||||
result.main = output_file_name;
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
72
src/core/create_compilers/index.ts
Normal file
72
src/core/create_compilers/index.ts
Normal file
@@ -0,0 +1,72 @@
|
||||
import * as path from 'path';
|
||||
import RollupCompiler from './RollupCompiler';
|
||||
import { WebpackCompiler } from './WebpackCompiler';
|
||||
import { set_dev, set_src, set_dest } from '../../config/env';
|
||||
|
||||
export type Compiler = RollupCompiler | WebpackCompiler;
|
||||
|
||||
export type Compilers = {
|
||||
client: Compiler;
|
||||
server: Compiler;
|
||||
serviceworker?: Compiler;
|
||||
}
|
||||
|
||||
export default async function create_compilers(
|
||||
bundler: 'rollup' | 'webpack',
|
||||
cwd: string,
|
||||
src: string,
|
||||
dest: string,
|
||||
dev: boolean
|
||||
): Promise<Compilers> {
|
||||
set_dev(dev);
|
||||
set_src(src);
|
||||
set_dest(dest);
|
||||
|
||||
if (bundler === 'rollup') {
|
||||
const config = await RollupCompiler.load_config(cwd);
|
||||
validate_config(config, 'rollup');
|
||||
|
||||
normalize_rollup_config(config.client);
|
||||
normalize_rollup_config(config.server);
|
||||
|
||||
if (config.serviceworker) {
|
||||
normalize_rollup_config(config.serviceworker);
|
||||
}
|
||||
|
||||
return {
|
||||
client: new RollupCompiler(config.client),
|
||||
server: new RollupCompiler(config.server),
|
||||
serviceworker: config.serviceworker && new RollupCompiler(config.serviceworker)
|
||||
};
|
||||
}
|
||||
|
||||
if (bundler === 'webpack') {
|
||||
const config = require(path.resolve(cwd, 'webpack.config.js'));
|
||||
validate_config(config, 'webpack');
|
||||
|
||||
return {
|
||||
client: new WebpackCompiler(config.client),
|
||||
server: new WebpackCompiler(config.server),
|
||||
serviceworker: config.serviceworker && new WebpackCompiler(config.serviceworker)
|
||||
};
|
||||
}
|
||||
|
||||
// this shouldn't be possible...
|
||||
throw new Error(`Invalid bundler option '${bundler}'`);
|
||||
}
|
||||
|
||||
function validate_config(config: any, bundler: 'rollup' | 'webpack') {
|
||||
if (!config.client || !config.server) {
|
||||
throw new Error(`${bundler}.config.js must export a { client, server, serviceworker? } object`);
|
||||
}
|
||||
}
|
||||
|
||||
function normalize_rollup_config(config: any) {
|
||||
if (typeof config.input === 'string') {
|
||||
config.input = path.normalize(config.input);
|
||||
} else {
|
||||
for (const name in config.input) {
|
||||
config.input[name] = path.normalize(config.input[name]);
|
||||
}
|
||||
}
|
||||
}
|
||||
39
src/core/create_compilers/interfaces.ts
Normal file
39
src/core/create_compilers/interfaces.ts
Normal file
@@ -0,0 +1,39 @@
|
||||
import { ManifestData, Dirs } from '../../interfaces';
|
||||
|
||||
export type Chunk = {
|
||||
file: string;
|
||||
imports: string[];
|
||||
modules: string[];
|
||||
}
|
||||
|
||||
export type CssFile = {
|
||||
id: string;
|
||||
code: string;
|
||||
};
|
||||
|
||||
export class CompileError {
|
||||
file: string;
|
||||
message: string;
|
||||
}
|
||||
|
||||
export interface CompileResult {
|
||||
duration: number;
|
||||
errors: CompileError[];
|
||||
warnings: CompileError[];
|
||||
chunks: Chunk[];
|
||||
assets: Record<string, string>;
|
||||
css_files: CssFile[];
|
||||
|
||||
to_json: (manifest_data: ManifestData, dirs: Dirs) => BuildInfo
|
||||
}
|
||||
|
||||
export type BuildInfo = {
|
||||
bundler: string;
|
||||
shimport: string;
|
||||
assets: Record<string, string>;
|
||||
legacy_assets?: Record<string, string>;
|
||||
css: {
|
||||
main: string | null,
|
||||
chunks: Record<string, string[]>
|
||||
}
|
||||
}
|
||||
327
src/core/create_manifest_data.ts
Normal file
327
src/core/create_manifest_data.ts
Normal file
@@ -0,0 +1,327 @@
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
import svelte from 'svelte/compiler';
|
||||
import { Page, PageComponent, ServerRoute, ManifestData } from '../interfaces';
|
||||
import { posixify, reserved_words } from '../utils';
|
||||
|
||||
export default function create_manifest_data(cwd: string): ManifestData {
|
||||
// TODO remove in a future version
|
||||
if (!fs.existsSync(cwd)) {
|
||||
throw new Error(`As of Sapper 0.21, the routes/ directory should become src/routes/`);
|
||||
}
|
||||
|
||||
function has_preload(file: string) {
|
||||
const source = fs.readFileSync(path.join(cwd, file), 'utf-8');
|
||||
|
||||
if (/preload/.test(source)) {
|
||||
try {
|
||||
const { stats } = svelte.compile(source, {
|
||||
generate: false,
|
||||
onwarn: () => {}
|
||||
});
|
||||
return !!stats.vars.find((variable: any) => variable.module && variable.export_name === 'preload');
|
||||
} catch (err) {}
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
const components: PageComponent[] = [];
|
||||
const pages: Page[] = [];
|
||||
const server_routes: ServerRoute[] = [];
|
||||
|
||||
const default_layout: PageComponent = {
|
||||
default: true,
|
||||
name: '_default_layout',
|
||||
file: null,
|
||||
has_preload: false
|
||||
};
|
||||
|
||||
function walk(
|
||||
dir: string,
|
||||
parent_segments: Part[][],
|
||||
parent_params: string[],
|
||||
stack: Array<{
|
||||
component: PageComponent,
|
||||
params: string[]
|
||||
}>
|
||||
) {
|
||||
const items = fs.readdirSync(dir)
|
||||
.map(basename => {
|
||||
const resolved = path.join(dir, basename);
|
||||
const file = path.relative(cwd, resolved);
|
||||
const is_dir = fs.statSync(resolved).isDirectory();
|
||||
|
||||
const ext = path.extname(basename);
|
||||
if (!is_dir && !/^\.[a-z]+$/i.test(ext)) return null; // filter out tmp files etc
|
||||
|
||||
const segment = is_dir
|
||||
? basename
|
||||
: basename.slice(0, -path.extname(basename).length);
|
||||
|
||||
const parts = get_parts(segment);
|
||||
const is_index = is_dir ? false : basename.startsWith('index.');
|
||||
const is_page = ext === '.html';
|
||||
|
||||
parts.forEach(part => {
|
||||
if (/\]\[/.test(part.content)) {
|
||||
throw new Error(`Invalid route ${file} — parameters must be separated`);
|
||||
}
|
||||
|
||||
if (part.qualifier && /[\(\)\?\:]/.test(part.qualifier.slice(1, -1))) {
|
||||
throw new Error(`Invalid route ${file} — cannot use (, ), ? or : in route qualifiers`);
|
||||
}
|
||||
});
|
||||
|
||||
return {
|
||||
basename,
|
||||
parts,
|
||||
file: posixify(file),
|
||||
is_dir,
|
||||
is_index,
|
||||
is_page
|
||||
};
|
||||
})
|
||||
.filter(Boolean)
|
||||
.sort(comparator);
|
||||
|
||||
items.forEach(item => {
|
||||
if (item.basename[0] === '_') return;
|
||||
|
||||
if (item.basename[0] === '.') {
|
||||
if (item.file !== '.well-known') return;
|
||||
}
|
||||
|
||||
const segments = parent_segments.slice();
|
||||
|
||||
if (item.is_index && segments.length > 0) {
|
||||
const last_segment = segments[segments.length - 1].slice();
|
||||
const suffix = item.basename
|
||||
.slice(0, -path.extname(item.basename).length).
|
||||
replace('index', '');
|
||||
|
||||
if (suffix) {
|
||||
const last_part = last_segment[last_segment.length - 1];
|
||||
if (last_part.dynamic) {
|
||||
last_segment.push({ dynamic: false, content: suffix });
|
||||
} else {
|
||||
last_segment[last_segment.length - 1] = {
|
||||
dynamic: false,
|
||||
content: `${last_part.content}${suffix}`
|
||||
};
|
||||
}
|
||||
|
||||
segments[segments.length - 1] = last_segment;
|
||||
}
|
||||
} else {
|
||||
segments.push(item.parts);
|
||||
}
|
||||
|
||||
const params = parent_params.slice();
|
||||
params.push(...item.parts.filter(p => p.dynamic).map(p => p.content));
|
||||
|
||||
if (item.is_dir) {
|
||||
const index = path.join(dir, item.basename, '_layout.html');
|
||||
|
||||
const component = fs.existsSync(index) && {
|
||||
name: `${get_slug(item.file)}__layout`,
|
||||
file: `${item.file}/_layout.html`,
|
||||
has_preload: has_preload(`${item.file}/_layout.html`)
|
||||
};
|
||||
|
||||
if (component) components.push(component);
|
||||
|
||||
walk(
|
||||
path.join(dir, item.basename),
|
||||
segments,
|
||||
params,
|
||||
component
|
||||
? stack.concat({ component, params })
|
||||
: stack.concat(null)
|
||||
);
|
||||
}
|
||||
|
||||
else if (item.is_page) {
|
||||
const component = {
|
||||
name: get_slug(item.file),
|
||||
file: item.file,
|
||||
has_preload: has_preload(item.file)
|
||||
};
|
||||
|
||||
const parts = stack.concat({
|
||||
component,
|
||||
params
|
||||
});
|
||||
|
||||
components.push(component);
|
||||
if (item.basename === 'index.html') {
|
||||
pages.push({
|
||||
pattern: get_pattern(parent_segments, true),
|
||||
parts
|
||||
});
|
||||
} else {
|
||||
pages.push({
|
||||
pattern: get_pattern(segments, true),
|
||||
parts
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
else {
|
||||
server_routes.push({
|
||||
name: `route_${get_slug(item.file)}`,
|
||||
pattern: get_pattern(segments, false),
|
||||
file: item.file,
|
||||
params: params
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const root_file = path.join(cwd, '_layout.html');
|
||||
const root = fs.existsSync(root_file)
|
||||
? {
|
||||
name: 'main',
|
||||
file: '_layout.html',
|
||||
has_preload: has_preload('_layout.html')
|
||||
}
|
||||
: default_layout;
|
||||
|
||||
walk(cwd, [], [], []);
|
||||
|
||||
// check for clashes
|
||||
const seen_pages: Map<string, Page> = new Map();
|
||||
pages.forEach(page => {
|
||||
const pattern = page.pattern.toString();
|
||||
if (seen_pages.has(pattern)) {
|
||||
const file = page.parts.pop().component.file;
|
||||
const other_page = seen_pages.get(pattern);
|
||||
const other_file = other_page.parts.pop().component.file;
|
||||
|
||||
throw new Error(`The ${other_file} and ${file} pages clash`);
|
||||
}
|
||||
|
||||
seen_pages.set(pattern, page);
|
||||
});
|
||||
|
||||
const seen_routes: Map<string, ServerRoute> = new Map();
|
||||
server_routes.forEach(route => {
|
||||
const pattern = route.pattern.toString();
|
||||
if (seen_routes.has(pattern)) {
|
||||
const other_route = seen_routes.get(pattern);
|
||||
throw new Error(`The ${other_route.file} and ${route.file} routes clash`);
|
||||
}
|
||||
|
||||
seen_routes.set(pattern, route);
|
||||
});
|
||||
|
||||
return {
|
||||
root,
|
||||
components,
|
||||
pages,
|
||||
server_routes
|
||||
};
|
||||
}
|
||||
|
||||
type Part = {
|
||||
content: string;
|
||||
dynamic: boolean;
|
||||
qualifier?: string;
|
||||
};
|
||||
|
||||
function comparator(
|
||||
a: { basename: string, parts: Part[], file: string, is_index: boolean },
|
||||
b: { basename: string, parts: Part[], file: string, is_index: boolean }
|
||||
) {
|
||||
if (a.is_index !== b.is_index) return a.is_index ? -1 : 1;
|
||||
|
||||
const max = Math.max(a.parts.length, b.parts.length);
|
||||
|
||||
for (let i = 0; i < max; i += 1) {
|
||||
const a_sub_part = a.parts[i];
|
||||
const b_sub_part = b.parts[i];
|
||||
|
||||
if (!a_sub_part) return 1; // b is more specific, so goes first
|
||||
if (!b_sub_part) return -1;
|
||||
|
||||
if (a_sub_part.dynamic !== b_sub_part.dynamic) {
|
||||
return a_sub_part.dynamic ? 1 : -1;
|
||||
}
|
||||
|
||||
if (!a_sub_part.dynamic && a_sub_part.content !== b_sub_part.content) {
|
||||
return (
|
||||
(b_sub_part.content.length - a_sub_part.content.length) ||
|
||||
(a_sub_part.content < b_sub_part.content ? -1 : 1)
|
||||
);
|
||||
}
|
||||
|
||||
// If both parts dynamic, check for regexp patterns
|
||||
if (a_sub_part.dynamic && b_sub_part.dynamic) {
|
||||
const regexp_pattern = /\((.*?)\)/;
|
||||
const a_match = regexp_pattern.exec(a_sub_part.content);
|
||||
const b_match = regexp_pattern.exec(b_sub_part.content);
|
||||
|
||||
if (!a_match && b_match) {
|
||||
return 1; // No regexp, so less specific than b
|
||||
}
|
||||
if (!b_match && a_match) {
|
||||
return -1;
|
||||
}
|
||||
if (a_match && b_match && a_match[1] !== b_match[1]) {
|
||||
return b_match[1].length - a_match[1].length;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function get_parts(part: string): Part[] {
|
||||
return part.split(/\[(.+)\]/)
|
||||
.map((str, i) => {
|
||||
if (!str) return null;
|
||||
const dynamic = i % 2 === 1;
|
||||
|
||||
const [, content, qualifier] = dynamic
|
||||
? /([^(]+)(\(.+\))?$/.exec(str)
|
||||
: [, str, null];
|
||||
|
||||
return {
|
||||
content,
|
||||
dynamic,
|
||||
qualifier
|
||||
};
|
||||
})
|
||||
.filter(Boolean);
|
||||
}
|
||||
|
||||
function get_slug(file: string) {
|
||||
let name = file
|
||||
.replace(/[\\\/]index/, '')
|
||||
.replace(/_default([\/\\index])?\.html$/, 'index')
|
||||
.replace(/[\/\\]/g, '_')
|
||||
.replace(/\.\w+$/, '')
|
||||
.replace(/\[([^(]+)(?:\([^(]+\))?\]/, '$$$1')
|
||||
.replace(/[^a-zA-Z0-9_$]/g, c => {
|
||||
return c === '.' ? '_' : `$${c.charCodeAt(0)}`
|
||||
});
|
||||
|
||||
if (reserved_words.has(name)) name += '_';
|
||||
return name;
|
||||
}
|
||||
|
||||
function get_pattern(segments: Part[][], add_trailing_slash: boolean) {
|
||||
return new RegExp(
|
||||
`^` +
|
||||
segments.map(segment => {
|
||||
return '\\/' + segment.map(part => {
|
||||
return part.dynamic
|
||||
? part.qualifier || '([^\\/]+?)'
|
||||
: encodeURI(part.content.normalize())
|
||||
.replace(/\?/g, '%3F')
|
||||
.replace(/#/g, '%23')
|
||||
.replace(/%5B/g, '[')
|
||||
.replace(/%5D/g, ']');
|
||||
}).join('');
|
||||
}).join('') +
|
||||
(add_trailing_slash ? '\\\/?$' : '$')
|
||||
);
|
||||
}
|
||||
242
src/core/create_manifests.ts
Normal file
242
src/core/create_manifests.ts
Normal file
@@ -0,0 +1,242 @@
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
import { posixify, stringify, walk, write_if_changed } from '../utils';
|
||||
import { Page, PageComponent, ManifestData } from '../interfaces';
|
||||
|
||||
export function create_main_manifests({
|
||||
bundler,
|
||||
manifest_data,
|
||||
dev_port,
|
||||
dev,
|
||||
cwd,
|
||||
src,
|
||||
dest,
|
||||
routes,
|
||||
output
|
||||
}: {
|
||||
bundler: string,
|
||||
manifest_data: ManifestData;
|
||||
dev_port?: number;
|
||||
dev: boolean;
|
||||
cwd: string;
|
||||
src: string;
|
||||
dest: string;
|
||||
routes: string;
|
||||
output: string
|
||||
}) {
|
||||
if (!fs.existsSync(output)) fs.mkdirSync(output);
|
||||
|
||||
const path_to_routes = path.relative(`${output}/internal`, routes);
|
||||
|
||||
const client_manifest = generate_client_manifest(manifest_data, path_to_routes, bundler, dev, dev_port);
|
||||
const server_manifest = generate_server_manifest(manifest_data, path_to_routes, cwd, src, dest, dev);
|
||||
|
||||
write_if_changed(`${output}/internal/manifest-client.mjs`, client_manifest);
|
||||
write_if_changed(`${output}/internal/manifest-server.mjs`, server_manifest);
|
||||
}
|
||||
|
||||
export function create_serviceworker_manifest({ manifest_data, output, client_files, static_files }: {
|
||||
manifest_data: ManifestData;
|
||||
output: string;
|
||||
client_files: string[];
|
||||
static_files: string;
|
||||
}) {
|
||||
let files: string[] = ['/service-worker-index.html'];
|
||||
|
||||
if (fs.existsSync(static_files)) {
|
||||
files = files.concat(walk(static_files));
|
||||
} else {
|
||||
// TODO remove in a future version
|
||||
if (fs.existsSync('assets')) {
|
||||
throw new Error(`As of Sapper 0.21, the assets/ directory should become static/`);
|
||||
}
|
||||
}
|
||||
|
||||
let code = `
|
||||
// This file is generated by Sapper — do not edit it!
|
||||
export const timestamp = ${Date.now()};
|
||||
|
||||
export const files = [\n\t${files.map((x: string) => stringify(x)).join(',\n\t')}\n];
|
||||
export { files as assets }; // legacy
|
||||
|
||||
export const shell = [\n\t${client_files.map((x: string) => stringify(x)).join(',\n\t')}\n];
|
||||
|
||||
export const routes = [\n\t${manifest_data.pages.map((r: Page) => `{ pattern: ${r.pattern} }`).join(',\n\t')}\n];
|
||||
`.replace(/^\t\t/gm, '').trim();
|
||||
|
||||
write_if_changed(`${output}/service-worker.js`, code);
|
||||
}
|
||||
|
||||
function generate_client_manifest(
|
||||
manifest_data: ManifestData,
|
||||
path_to_routes: string,
|
||||
bundler: string,
|
||||
dev: boolean,
|
||||
dev_port?: number
|
||||
) {
|
||||
const page_ids = new Set(manifest_data.pages.map(page =>
|
||||
page.pattern.toString()));
|
||||
|
||||
const server_routes_to_ignore = manifest_data.server_routes.filter(route =>
|
||||
!page_ids.has(route.pattern.toString()));
|
||||
|
||||
const component_indexes: Record<string, number> = {};
|
||||
|
||||
const components = `[
|
||||
${manifest_data.components.map((component, i) => {
|
||||
const annotation = bundler === 'webpack'
|
||||
? `/* webpackChunkName: "${component.name}" */ `
|
||||
: '';
|
||||
|
||||
const source = get_file(path_to_routes, component);
|
||||
|
||||
component_indexes[component.name] = i;
|
||||
|
||||
return `{
|
||||
js: () => import(${annotation}${stringify(source)}),
|
||||
css: "__SAPPER_CSS_PLACEHOLDER:${stringify(component.file, false)}__"
|
||||
}`;
|
||||
}).join(',\n\t\t\t\t')}
|
||||
]`.replace(/^\t/gm, '');
|
||||
|
||||
let needs_decode = false;
|
||||
|
||||
let routes = `[
|
||||
${manifest_data.pages.map(page => `{
|
||||
// ${page.parts[page.parts.length - 1].component.file}
|
||||
pattern: ${page.pattern},
|
||||
parts: [
|
||||
${page.parts.map(part => {
|
||||
if (part === null) return 'null';
|
||||
|
||||
if (part.params.length > 0) {
|
||||
needs_decode = true;
|
||||
const props = part.params.map((param, i) => `${param}: d(match[${i + 1}])`);
|
||||
return `{ i: ${component_indexes[part.component.name]}, params: match => ({ ${props.join(', ')} }) }`;
|
||||
}
|
||||
|
||||
return `{ i: ${component_indexes[part.component.name]} }`;
|
||||
}).join(',\n\t\t\t\t\t\t')}
|
||||
]
|
||||
}`).join(',\n\n\t\t\t\t')}
|
||||
]`.replace(/^\t/gm, '');
|
||||
|
||||
if (needs_decode) {
|
||||
routes = `(d => ${routes})(decodeURIComponent)`
|
||||
}
|
||||
|
||||
return `
|
||||
// This file is generated by Sapper — do not edit it!
|
||||
export { default as Root } from '${stringify(get_file(path_to_routes, manifest_data.root), false)}';
|
||||
export { preload as root_preload } from '${manifest_data.root.has_preload ? stringify(get_file(path_to_routes, manifest_data.root), false) : './shared'}';
|
||||
export { default as ErrorComponent } from '${stringify(posixify(`${path_to_routes}/_error.html`), false)}';
|
||||
|
||||
export const ignore = [${server_routes_to_ignore.map(route => route.pattern).join(', ')}];
|
||||
|
||||
export const components = ${components};
|
||||
|
||||
export const routes = ${routes};
|
||||
|
||||
${dev ? `if (typeof window !== 'undefined') {
|
||||
import(${stringify(posixify(path.resolve(__dirname, '../sapper-dev-client.js')))}).then(client => {
|
||||
client.connect(${dev_port});
|
||||
});
|
||||
}` : ''}
|
||||
`.replace(/^\t{2}/gm, '').trim();
|
||||
}
|
||||
|
||||
function generate_server_manifest(
|
||||
manifest_data: ManifestData,
|
||||
path_to_routes: string,
|
||||
cwd: string,
|
||||
src: string,
|
||||
dest: string,
|
||||
dev: boolean
|
||||
) {
|
||||
const imports = [].concat(
|
||||
manifest_data.server_routes.map((route, i) =>
|
||||
`import * as route_${i} from ${stringify(posixify(`${path_to_routes}/${route.file}`))};`),
|
||||
manifest_data.components.map((component, i) =>
|
||||
`import component_${i}${component.has_preload ? `, { preload as preload_${i} }` : ''} from ${stringify(get_file(path_to_routes, component))};`),
|
||||
`import root${manifest_data.root.has_preload ? `, { preload as root_preload }` : ''} from ${stringify(get_file(path_to_routes, manifest_data.root))};`,
|
||||
`import error from ${stringify(posixify(`${path_to_routes}/_error.html`))};`
|
||||
);
|
||||
|
||||
const component_lookup: Record<string, number> = {};
|
||||
manifest_data.components.forEach((component, i) => {
|
||||
component_lookup[component.name] = i;
|
||||
});
|
||||
|
||||
let code = `
|
||||
`.replace(/^\t\t/gm, '').trim();
|
||||
|
||||
const build_dir = posixify(path.relative(cwd, dest));
|
||||
const src_dir = posixify(path.relative(cwd, src));
|
||||
|
||||
return `
|
||||
// This file is generated by Sapper — do not edit it!
|
||||
${imports.join('\n')}
|
||||
|
||||
const d = decodeURIComponent;
|
||||
|
||||
export const manifest = {
|
||||
server_routes: [
|
||||
${manifest_data.server_routes.map((route, i) => `{
|
||||
// ${route.file}
|
||||
pattern: ${route.pattern},
|
||||
handlers: route_${i},
|
||||
params: ${route.params.length > 0
|
||||
? `match => ({ ${route.params.map((param, i) => `${param}: d(match[${i + 1}])`).join(', ')} })`
|
||||
: `() => ({})`}
|
||||
}`).join(',\n\n\t\t\t\t')}
|
||||
],
|
||||
|
||||
pages: [
|
||||
${manifest_data.pages.map(page => `{
|
||||
// ${page.parts[page.parts.length - 1].component.file}
|
||||
pattern: ${page.pattern},
|
||||
parts: [
|
||||
${page.parts.map(part => {
|
||||
if (part === null) return 'null';
|
||||
|
||||
const props = [
|
||||
`name: "${part.component.name}"`,
|
||||
`file: ${stringify(part.component.file)}`,
|
||||
`component: component_${component_lookup[part.component.name]}`,
|
||||
part.component.has_preload && `preload: preload_${component_lookup[part.component.name]}`
|
||||
].filter(Boolean);
|
||||
|
||||
if (part.params.length > 0) {
|
||||
const params = part.params.map((param, i) => `${param}: d(match[${i + 1}])`);
|
||||
props.push(`params: match => ({ ${params.join(', ')} })`);
|
||||
}
|
||||
|
||||
return `{ ${props.join(', ')} }`;
|
||||
}).join(',\n\t\t\t\t\t\t')}
|
||||
]
|
||||
}`).join(',\n\n\t\t\t\t')}
|
||||
],
|
||||
|
||||
root,
|
||||
root_preload${manifest_data.root.has_preload ? '' : `: () => {}`},
|
||||
error
|
||||
};
|
||||
|
||||
export const build_dir = ${JSON.stringify(build_dir)};
|
||||
|
||||
export const src_dir = ${JSON.stringify(src_dir)};
|
||||
|
||||
export const dev = ${dev ? 'true' : 'false'};
|
||||
`.replace(/^\t{2}/gm, '').trim();
|
||||
|
||||
return `// This file is generated by Sapper — do not edit it!\n` + template
|
||||
.replace('__BUILD__DIR__', JSON.stringify(build_dir))
|
||||
.replace('__SRC__DIR__', JSON.stringify(src_dir))
|
||||
.replace('__DEV__', dev ? 'true' : 'false')
|
||||
.replace(/const manifest = __MANIFEST__;/, code);
|
||||
}
|
||||
|
||||
function get_file(path_to_routes: string, component: PageComponent) {
|
||||
if (component.default) return `./layout.html`;
|
||||
return posixify(`${path_to_routes}/${component.file}`);
|
||||
}
|
||||
@@ -1,95 +0,0 @@
|
||||
import * as path from 'path';
|
||||
import glob from 'glob';
|
||||
import { Route } from '../interfaces';
|
||||
|
||||
export default function create_routes({ src, files = glob.sync('**/*.+(html|js|mjs)', { cwd: src }) }: {
|
||||
src: string;
|
||||
files?: string[];
|
||||
}) {
|
||||
const routes: Route[] = files
|
||||
.map((file: string) => {
|
||||
if (/(^|\/|\\)_/.test(file)) return;
|
||||
|
||||
const parts = file.replace(/\.(html|js|mjs)$/, '').split('/'); // glob output is always posix-style
|
||||
if (parts[parts.length - 1] === 'index') parts.pop();
|
||||
|
||||
const id = (
|
||||
parts.join('_').replace(/[[\]]/g, '$').replace(/^\d/, '_$&').replace(/[^a-zA-Z0-9_$]/g, '_')
|
||||
) || '_';
|
||||
|
||||
const dynamic = parts
|
||||
.filter(part => part[0] === '[')
|
||||
.map(part => part.slice(1, -1));
|
||||
|
||||
let pattern_string = '';
|
||||
let i = parts.length;
|
||||
let nested = true;
|
||||
while (i--) {
|
||||
const part = parts[i];
|
||||
const dynamic = part[0] === '[';
|
||||
|
||||
if (dynamic) {
|
||||
pattern_string = nested ? `(?:\\/([^/]+)${pattern_string})?` : `\\/([^/]+)${pattern_string}`;
|
||||
} else {
|
||||
nested = false;
|
||||
pattern_string = `\\/${part}${pattern_string}`;
|
||||
}
|
||||
}
|
||||
|
||||
const pattern = new RegExp(`^${pattern_string}\\/?$`);
|
||||
|
||||
const test = (url: string) => pattern.test(url);
|
||||
|
||||
const exec = (url: string) => {
|
||||
const match = pattern.exec(url);
|
||||
if (!match) return;
|
||||
|
||||
const params: Record<string, string> = {};
|
||||
dynamic.forEach((param, i) => {
|
||||
params[param] = match[i + 1];
|
||||
});
|
||||
|
||||
return params;
|
||||
};
|
||||
|
||||
return {
|
||||
id,
|
||||
type: path.extname(file) === '.html' ? 'page' : 'route',
|
||||
file,
|
||||
pattern,
|
||||
test,
|
||||
exec,
|
||||
parts,
|
||||
dynamic
|
||||
};
|
||||
})
|
||||
.filter(Boolean)
|
||||
.sort((a: Route, b: Route) => {
|
||||
let same = true;
|
||||
|
||||
for (let i = 0; true; i += 1) {
|
||||
const a_part = a.parts[i];
|
||||
const b_part = b.parts[i];
|
||||
|
||||
if (!a_part && !b_part) {
|
||||
if (same) throw new Error(`The ${a.file} and ${b.file} routes clash`);
|
||||
return 0;
|
||||
}
|
||||
|
||||
if (!a_part) return -1;
|
||||
if (!b_part) return 1;
|
||||
|
||||
const a_is_dynamic = a_part[0] === '[';
|
||||
const b_is_dynamic = b_part[0] === '[';
|
||||
|
||||
if (a_is_dynamic === b_is_dynamic) {
|
||||
if (!a_is_dynamic && a_part !== b_part) same = false;
|
||||
continue;
|
||||
}
|
||||
|
||||
return a_is_dynamic ? 1 : -1;
|
||||
}
|
||||
});
|
||||
|
||||
return routes;
|
||||
}
|
||||
@@ -1,27 +0,0 @@
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
import glob from 'glob';
|
||||
import create_routes from './create_routes';
|
||||
import { fudge_mtime, posixify, write } from './utils';
|
||||
import { Route } from '../interfaces';
|
||||
|
||||
export default function create_serviceworker({ routes, client_files, src }: {
|
||||
routes: Route[];
|
||||
client_files: string[];
|
||||
src: string;
|
||||
}) {
|
||||
const assets = glob.sync('**', { cwd: 'assets', nodir: true });
|
||||
|
||||
let code = `
|
||||
// This file is generated by Sapper — do not edit it!
|
||||
export const timestamp = ${Date.now()};
|
||||
|
||||
export const assets = [\n\t${assets.map((x: string) => `"${x}"`).join(',\n\t')}\n];
|
||||
|
||||
export const shell = [\n\t${client_files.map((x: string) => `"${x}"`).join(',\n\t')}\n];
|
||||
|
||||
export const routes = [\n\t${routes.filter((r: Route) => r.type === 'page' && !/^_[45]xx$/.test(r.id)).map((r: Route) => `{ pattern: ${r.pattern} }`).join(',\n\t')}\n];
|
||||
`.replace(/^\t\t/gm, '').trim();
|
||||
|
||||
write('app/manifest/service-worker.js', code);
|
||||
}
|
||||
@@ -1,39 +0,0 @@
|
||||
import * as fs from 'fs';
|
||||
import chalk from 'chalk';
|
||||
import framer from 'code-frame';
|
||||
import { locate } from 'locate-character';
|
||||
|
||||
function error(e: any) {
|
||||
if (e.title) console.error(chalk.bold.red(e.title));
|
||||
if (e.body) console.error(chalk.red(e.body));
|
||||
if (e.url) console.error(chalk.cyan(e.url));
|
||||
if (e.frame) console.error(chalk.grey(e.frame));
|
||||
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
export default function create_templates() {
|
||||
const template = fs.readFileSync(`app/template.html`, 'utf-8');
|
||||
|
||||
const index = template.indexOf('%sapper.main%');
|
||||
if (index !== -1) {
|
||||
// TODO remove this in a future version
|
||||
const { line, column } = locate(template, index, { offsetLine: 1 });
|
||||
const frame = framer(template, line, column);
|
||||
|
||||
error({
|
||||
title: `app/template.html`,
|
||||
body: `<script src='%sapper.main%'> is unsupported — use %sapper.scripts% (without the <script> tag) instead`,
|
||||
url: 'https://github.com/sveltejs/sapper/issues/86',
|
||||
frame
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
render: (data: Record<string, string>) => {
|
||||
return template.replace(/%sapper\.(\w+)%/g, (match, key) => {
|
||||
return key in data ? data[key] : '';
|
||||
});
|
||||
}
|
||||
};
|
||||
}
|
||||
@@ -1,5 +0,0 @@
|
||||
export { default as create_app } from './create_app';
|
||||
export { default as create_serviceworker } from './create_serviceworker';
|
||||
export { default as create_compilers } from './create_compilers';
|
||||
export { default as create_routes } from './create_routes';
|
||||
export { default as create_template } from './create_template';
|
||||
16
src/core/read_template.ts
Normal file
16
src/core/read_template.ts
Normal file
@@ -0,0 +1,16 @@
|
||||
import * as fs from 'fs';
|
||||
|
||||
export default function read_template(dir: string) {
|
||||
try {
|
||||
return fs.readFileSync(`${dir}/template.html`, 'utf-8');
|
||||
} catch (err) {
|
||||
if (fs.existsSync(`app/template.html`)) {
|
||||
throw new Error(`As of Sapper 0.21, the default folder structure has been changed:
|
||||
app/ --> src/
|
||||
routes/ --> src/routes/
|
||||
assets/ --> static/`);
|
||||
}
|
||||
|
||||
throw err;
|
||||
}
|
||||
}
|
||||
@@ -1,20 +0,0 @@
|
||||
import * as fs from 'fs';
|
||||
|
||||
export function write(file: string, code: string) {
|
||||
fs.writeFileSync(file, code);
|
||||
fudge_mtime(file);
|
||||
}
|
||||
|
||||
export function posixify(file: string) {
|
||||
return file.replace(/[/\\]/g, '/');
|
||||
}
|
||||
|
||||
export function fudge_mtime(file: string) {
|
||||
// need to fudge the mtime so that webpack doesn't go doolally
|
||||
const { atime, mtime } = fs.statSync(file);
|
||||
fs.utimesSync(
|
||||
file,
|
||||
new Date(atime.getTime() - 999999),
|
||||
new Date(mtime.getTime() - 999999)
|
||||
);
|
||||
}
|
||||
@@ -1,15 +1,103 @@
|
||||
import * as child_process from 'child_process';
|
||||
import { CompileResult } from './core/create_compilers/interfaces';
|
||||
|
||||
export type Route = {
|
||||
id: string;
|
||||
type: 'page' | 'route';
|
||||
file: string;
|
||||
handlers: {
|
||||
type: 'page' | 'route';
|
||||
file: string;
|
||||
}[];
|
||||
pattern: RegExp;
|
||||
test: (url: string) => boolean;
|
||||
exec: (url: string) => Record<string, string>;
|
||||
parts: string[];
|
||||
dynamic: string[];
|
||||
params: string[];
|
||||
};
|
||||
|
||||
export type Template = {
|
||||
render: (data: Record<string, string>) => string;
|
||||
stream: (req, res, data: Record<string, string | Promise<string>>) => void;
|
||||
};
|
||||
};
|
||||
|
||||
export type WritableStore<T> = {
|
||||
set: (value: T) => void;
|
||||
update: (fn: (value: T) => T) => void;
|
||||
subscribe: (fn: (T: any) => void) => () => void;
|
||||
};
|
||||
|
||||
export type PageComponent = {
|
||||
default?: boolean;
|
||||
name: string;
|
||||
file: string;
|
||||
has_preload: boolean;
|
||||
};
|
||||
|
||||
export type Page = {
|
||||
pattern: RegExp;
|
||||
parts: Array<{
|
||||
component: PageComponent;
|
||||
params: string[];
|
||||
}>
|
||||
};
|
||||
|
||||
export type ServerRoute = {
|
||||
name: string;
|
||||
pattern: RegExp;
|
||||
file: string;
|
||||
params: string[];
|
||||
};
|
||||
|
||||
export type Dirs = {
|
||||
dest: string,
|
||||
src: string,
|
||||
routes: string
|
||||
};
|
||||
|
||||
export type ManifestData = {
|
||||
root: PageComponent;
|
||||
components: PageComponent[];
|
||||
pages: Page[];
|
||||
server_routes: ServerRoute[];
|
||||
};
|
||||
|
||||
export type ReadyEvent = {
|
||||
port: number;
|
||||
process: child_process.ChildProcess;
|
||||
};
|
||||
|
||||
export type ErrorEvent = {
|
||||
type: string;
|
||||
message: string;
|
||||
};
|
||||
|
||||
export type FatalEvent = {
|
||||
message: string;
|
||||
};
|
||||
|
||||
export type InvalidEvent = {
|
||||
changed: string[];
|
||||
invalid: {
|
||||
client: boolean;
|
||||
server: boolean;
|
||||
serviceworker: boolean;
|
||||
}
|
||||
};
|
||||
|
||||
export type BuildEvent = {
|
||||
type: string;
|
||||
errors: Array<{ file: string, message: string, duplicate: boolean }>;
|
||||
warnings: Array<{ file: string, message: string, duplicate: boolean }>;
|
||||
duration: number;
|
||||
result: CompileResult;
|
||||
};
|
||||
|
||||
export type FileEvent = {
|
||||
file: string;
|
||||
size: number;
|
||||
};
|
||||
|
||||
export type FailureEvent = {
|
||||
|
||||
};
|
||||
|
||||
export type DoneEvent = {};
|
||||
@@ -1,347 +0,0 @@
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
import { ClientRequest, ServerResponse } from 'http';
|
||||
// import * as mime from 'mime';
|
||||
import mkdirp from 'mkdirp';
|
||||
import rimraf from 'rimraf';
|
||||
import serialize from 'serialize-javascript';
|
||||
import escape_html from 'escape-html';
|
||||
import { create_routes, templates, create_compilers, create_template } from 'sapper/core.js';
|
||||
import { dest, entry, isDev, src } from '../config';
|
||||
import { Route, Template } from '../interfaces';
|
||||
|
||||
const dev = isDev();
|
||||
|
||||
type RouteObject = {
|
||||
id: string;
|
||||
type: 'page' | 'route';
|
||||
pattern: RegExp;
|
||||
params: (match: RegExpMatchArray) => Record<string, string>;
|
||||
module: {
|
||||
render: (data: any) => {
|
||||
head: string;
|
||||
css: { code: string, map: any };
|
||||
html: string
|
||||
},
|
||||
preload: (data: any) => any | Promise<any>
|
||||
};
|
||||
error?: string;
|
||||
}
|
||||
|
||||
type Handler = (req: Req, res: ServerResponse, next: () => void) => void;
|
||||
|
||||
interface Req extends ClientRequest {
|
||||
url: string;
|
||||
method: string;
|
||||
pathname: string;
|
||||
params: Record<string, string>;
|
||||
}
|
||||
|
||||
export default function middleware({ routes }: {
|
||||
routes: RouteObject[]
|
||||
}) {
|
||||
const client_info = JSON.parse(fs.readFileSync(path.join(dest, 'client_info.json'), 'utf-8'));
|
||||
|
||||
const template = create_template();
|
||||
|
||||
const shell = try_read(path.join(dest, 'index.html'));
|
||||
const serviceworker = try_read(path.join(dest, 'service-worker.js'));
|
||||
|
||||
const middleware = compose_handlers([
|
||||
(req: Req, res: ServerResponse, next: () => void) => {
|
||||
req.pathname = req.url.replace(/\?.*/, '');
|
||||
next();
|
||||
},
|
||||
|
||||
shell && get_asset_handler({
|
||||
pathname: '/index.html',
|
||||
type: 'text/html',
|
||||
cache: 'max-age=600',
|
||||
body: shell
|
||||
}),
|
||||
|
||||
serviceworker && get_asset_handler({
|
||||
pathname: '/service-worker.js',
|
||||
type: 'application/javascript',
|
||||
cache: 'max-age=600',
|
||||
body: serviceworker
|
||||
}),
|
||||
|
||||
(req: Req, res: ServerResponse, next: () => void) => {
|
||||
if (req.pathname.startsWith('/client/')) {
|
||||
// const type = mime.getType(req.pathname);
|
||||
const type = 'application/javascript'; // TODO might not be, if using e.g. CSS plugin
|
||||
|
||||
// TODO cache?
|
||||
const rs = fs.createReadStream(path.join(dest, req.pathname.slice(1)));
|
||||
|
||||
rs.on('error', error => {
|
||||
res.statusCode = 404;
|
||||
res.end('not found');
|
||||
});
|
||||
|
||||
res.setHeader('Content-Type', type);
|
||||
res.setHeader('Cache-Control', 'max-age=31536000');
|
||||
rs.pipe(res);
|
||||
} else {
|
||||
next();
|
||||
}
|
||||
},
|
||||
|
||||
get_route_handler(client_info.assetsByChunkName, routes, template)
|
||||
].filter(Boolean));
|
||||
|
||||
return middleware;
|
||||
}
|
||||
|
||||
function get_asset_handler({ pathname, type, cache, body }: {
|
||||
pathname: string;
|
||||
type: string;
|
||||
cache: string;
|
||||
body: string;
|
||||
}) {
|
||||
return (req: Req, res: ServerResponse, next: () => void) => {
|
||||
if (req.pathname !== pathname) return next();
|
||||
|
||||
res.setHeader('Content-Type', type);
|
||||
res.setHeader('Cache-Control', cache);
|
||||
res.end(body);
|
||||
};
|
||||
}
|
||||
|
||||
const resolved = Promise.resolve();
|
||||
|
||||
function get_route_handler(chunks: Record<string, string>, routes: RouteObject[], template: Template) {
|
||||
function handle_route(route: RouteObject, req: Req, res: ServerResponse) {
|
||||
req.params = route.params(route.pattern.exec(req.pathname));
|
||||
|
||||
const mod = route.module;
|
||||
|
||||
if (route.type === 'page') {
|
||||
res.setHeader('Content-Type', 'text/html');
|
||||
|
||||
// preload main.js and current route
|
||||
// TODO detect other stuff we can preload? images, CSS, fonts?
|
||||
const link = []
|
||||
.concat(chunks.main, chunks[route.id])
|
||||
.map(file => `</client/${file}>;rel="preload";as="script"`)
|
||||
.join(', ');
|
||||
|
||||
res.setHeader('Link', link);
|
||||
|
||||
const data = { params: req.params, query: req.query };
|
||||
|
||||
let redirect: { statusCode: number, location: string };
|
||||
let error: { statusCode: number, message: Error | string };
|
||||
|
||||
Promise.resolve(
|
||||
mod.preload ? mod.preload.call({
|
||||
redirect: (statusCode: number, location: string) => {
|
||||
redirect = { statusCode, location };
|
||||
},
|
||||
error: (statusCode: number, message: Error | string) => {
|
||||
error = { statusCode, message };
|
||||
}
|
||||
}, req) : {}
|
||||
).catch(err => {
|
||||
error = { statusCode: 500, message: err };
|
||||
}).then(preloaded => {
|
||||
if (redirect) {
|
||||
res.statusCode = redirect.statusCode;
|
||||
res.setHeader('Location', redirect.location);
|
||||
res.end();
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
if (error) {
|
||||
handle_error(req, res, error.statusCode, error.message);
|
||||
return;
|
||||
}
|
||||
|
||||
const serialized = try_serialize(preloaded); // TODO bail on non-POJOs
|
||||
Object.assign(data, preloaded);
|
||||
|
||||
const { html, head, css } = mod.render(data);
|
||||
|
||||
let scripts = []
|
||||
.concat(chunks.main) // chunks main might be an array. it might not! thanks, webpack
|
||||
.map(file => `<script src='/client/${file}'></script>`)
|
||||
.join('');
|
||||
|
||||
scripts = `<script>__SAPPER__ = { preloaded: ${serialized} };</script>${scripts}`;
|
||||
|
||||
const page = template.render({
|
||||
scripts,
|
||||
html,
|
||||
head: `<noscript id='sapper-head-start'></noscript>${head}<noscript id='sapper-head-end'></noscript>`,
|
||||
styles: (css && css.code ? `<style>${css.code}</style>` : '')
|
||||
});
|
||||
|
||||
res.end(page);
|
||||
|
||||
if (process.send) {
|
||||
process.send({
|
||||
__sapper__: true,
|
||||
url: req.url,
|
||||
method: req.method,
|
||||
status: 200,
|
||||
type: 'text/html',
|
||||
body: page
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
else {
|
||||
const method = req.method.toLowerCase();
|
||||
// 'delete' cannot be exported from a module because it is a keyword,
|
||||
// so check for 'del' instead
|
||||
const method_export = method === 'delete' ? 'del' : method;
|
||||
const handler = mod[method_export];
|
||||
if (handler) {
|
||||
if (process.env.SAPPER_EXPORT) {
|
||||
const { write, end, setHeader } = res;
|
||||
const chunks: any[] = [];
|
||||
const headers: Record<string, string> = {};
|
||||
|
||||
// intercept data so that it can be exported
|
||||
res.write = function(chunk: any) {
|
||||
chunks.push(new Buffer(chunk));
|
||||
write.apply(res, arguments);
|
||||
};
|
||||
|
||||
res.setHeader = function(name: string, value: string) {
|
||||
headers[name.toLowerCase()] = value;
|
||||
setHeader.apply(res, arguments);
|
||||
};
|
||||
|
||||
res.end = function(chunk?: any) {
|
||||
if (chunk) chunks.push(new Buffer(chunk));
|
||||
end.apply(res, arguments);
|
||||
|
||||
process.send({
|
||||
__sapper__: true,
|
||||
url: req.url,
|
||||
method: req.method,
|
||||
status: res.statusCode,
|
||||
type: headers['content-type'],
|
||||
body: Buffer.concat(chunks).toString()
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
handler(req, res, () => {
|
||||
handle_not_found(req, res, 404, 'Not found');
|
||||
});
|
||||
} else {
|
||||
// no matching handler for method — 404
|
||||
handle_not_found(req, res, 404, 'Not found');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const not_found_route = routes.find((route: RouteObject) => route.error === '4xx');
|
||||
|
||||
function handle_not_found(req: Req, res: ServerResponse, statusCode: number, message: Error | string) {
|
||||
res.statusCode = statusCode;
|
||||
res.setHeader('Content-Type', 'text/html');
|
||||
|
||||
const error = message instanceof Error ? message : new Error(message);
|
||||
|
||||
const rendered = not_found_route ? not_found_route.module.render({
|
||||
status: 404,
|
||||
error
|
||||
}) : { head: '', css: null, html: error.message };
|
||||
|
||||
const { head, css, html } = rendered;
|
||||
|
||||
res.end(template.render({
|
||||
scripts: `<script src='/client/${chunks.main}'></script>`,
|
||||
html,
|
||||
head: `<noscript id='sapper-head-start'></noscript>${head}<noscript id='sapper-head-end'></noscript>`,
|
||||
styles: (css && css.code ? `<style>${css.code}</style>` : '')
|
||||
}));
|
||||
}
|
||||
|
||||
const error_route = routes.find((route: RouteObject) => route.error === '5xx');
|
||||
|
||||
function handle_error(req: Req, res: ServerResponse, statusCode: number, message: Error | string) {
|
||||
if (statusCode >= 400 && statusCode < 500) {
|
||||
return handle_not_found(req, res, statusCode, message);
|
||||
}
|
||||
|
||||
res.statusCode = statusCode;
|
||||
res.setHeader('Content-Type', 'text/html');
|
||||
|
||||
const error = message instanceof Error ? message : new Error(message);
|
||||
|
||||
const rendered = error_route ? error_route.module.render({
|
||||
status: 500,
|
||||
error
|
||||
}) : { head: '', css: null, html: `Internal server error: ${error.message}` };
|
||||
|
||||
const { head, css, html } = rendered;
|
||||
|
||||
res.end(template.render({
|
||||
scripts: `<script src='/client/${chunks.main}'></script>`,
|
||||
html,
|
||||
head: `<noscript id='sapper-head-start'></noscript>${head}<noscript id='sapper-head-end'></noscript>`,
|
||||
styles: (css && css.code ? `<style>${css.code}</style>` : '')
|
||||
}));
|
||||
}
|
||||
|
||||
return function find_route(req: Req, res: ServerResponse, next: () => void) {
|
||||
const url = req.pathname;
|
||||
|
||||
try {
|
||||
for (const route of routes) {
|
||||
if (!route.error && route.pattern.test(url)) return handle_route(route, req, res);
|
||||
}
|
||||
|
||||
handle_not_found(req, res, 404, 'Not found');
|
||||
} catch (error) {
|
||||
handle_error(req, res, 500, error);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function compose_handlers(handlers: Handler[]) {
|
||||
return (req: Req, res: ServerResponse, next: () => void) => {
|
||||
let i = 0;
|
||||
function go() {
|
||||
const handler = handlers[i];
|
||||
|
||||
if (handler) {
|
||||
handler(req, res, () => {
|
||||
i += 1;
|
||||
go();
|
||||
});
|
||||
} else {
|
||||
next();
|
||||
}
|
||||
}
|
||||
|
||||
go();
|
||||
};
|
||||
}
|
||||
|
||||
function read_json(file: string) {
|
||||
return JSON.parse(fs.readFileSync(file, 'utf-8'));
|
||||
}
|
||||
|
||||
function try_serialize(data: any) {
|
||||
try {
|
||||
return serialize(data);
|
||||
} catch (err) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
function try_read(file: string) {
|
||||
try {
|
||||
return fs.readFileSync(file, 'utf-8');
|
||||
} catch (err) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@@ -1,268 +0,0 @@
|
||||
import { detach, findAnchor, scroll_state, which } from './utils';
|
||||
import { Component, ComponentConstructor, Params, Query, Route, RouteData, ScrollPosition, Target } from './interfaces';
|
||||
|
||||
export let component: Component;
|
||||
let target: Node;
|
||||
let routes: Route[];
|
||||
let errors: { '4xx': Route, '5xx': Route };
|
||||
|
||||
const history = typeof window !== 'undefined' ? window.history : {
|
||||
pushState: (state: any, title: string, href: string) => {},
|
||||
replaceState: (state: any, title: string, href: string) => {},
|
||||
scrollRestoration: ''
|
||||
};
|
||||
|
||||
const scroll_history: Record<string, ScrollPosition> = {};
|
||||
let uid = 1;
|
||||
let cid: number;
|
||||
|
||||
if ('scrollRestoration' in history) {
|
||||
history.scrollRestoration = 'manual';
|
||||
}
|
||||
|
||||
function select_route(url: URL): Target {
|
||||
if (url.origin !== window.location.origin) return null;
|
||||
|
||||
for (const route of routes) {
|
||||
const match = route.pattern.exec(url.pathname);
|
||||
if (match) {
|
||||
const params = route.params(match);
|
||||
|
||||
const query: Record<string, string | true> = {};
|
||||
if (url.search.length > 0) {
|
||||
url.search.slice(1).split('&').forEach(searchParam => {
|
||||
const [, key, value] = /([^=]+)=(.*)/.exec(searchParam);
|
||||
query[key] = value || true;
|
||||
})
|
||||
}
|
||||
return { url, route, data: { params, query } };
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
let current_token: {};
|
||||
|
||||
function render(Component: ComponentConstructor, data: any, scroll: ScrollPosition, token: {}) {
|
||||
if (current_token !== token) return;
|
||||
|
||||
if (component) {
|
||||
component.destroy();
|
||||
} else {
|
||||
// first load — remove SSR'd <head> contents
|
||||
const start = document.querySelector('#sapper-head-start');
|
||||
const end = document.querySelector('#sapper-head-end');
|
||||
|
||||
if (start && end) {
|
||||
while (start.nextSibling !== end) detach(start.nextSibling);
|
||||
detach(start);
|
||||
detach(end);
|
||||
}
|
||||
|
||||
// preload additional routes
|
||||
routes.reduce((promise: Promise<any>, route) => promise.then(route.load), Promise.resolve());
|
||||
}
|
||||
|
||||
component = new Component({
|
||||
target,
|
||||
data,
|
||||
hydrate: !component
|
||||
});
|
||||
|
||||
if (scroll) {
|
||||
window.scrollTo(scroll.x, scroll.y);
|
||||
}
|
||||
}
|
||||
|
||||
function prepare_route(Component: ComponentConstructor, data: RouteData) {
|
||||
let redirect: { statusCode: number, location: string } = null;
|
||||
let error: { statusCode: number, message: Error | string } = null;
|
||||
|
||||
if (!Component.preload) {
|
||||
return { Component, data, redirect, error };
|
||||
}
|
||||
|
||||
if (!component && window.__SAPPER__ && window.__SAPPER__.preloaded) {
|
||||
return { Component, data: Object.assign(data, window.__SAPPER__.preloaded), redirect, error };
|
||||
}
|
||||
|
||||
return Promise.resolve(Component.preload.call({
|
||||
redirect: (statusCode: number, location: string) => {
|
||||
redirect = { statusCode, location };
|
||||
},
|
||||
error: (statusCode: number, message: Error | string) => {
|
||||
error = { statusCode, message };
|
||||
}
|
||||
}, data)).catch(err => {
|
||||
error = { statusCode: 500, message: err };
|
||||
}).then(preloaded => {
|
||||
if (error) {
|
||||
const route = error.statusCode >= 400 && error.statusCode < 500
|
||||
? errors['4xx']
|
||||
: errors['5xx'];
|
||||
|
||||
return route.load().then(({ default: Component }: { default: ComponentConstructor }) => {
|
||||
const err = error.message instanceof Error ? error.message : new Error(error.message);
|
||||
Object.assign(data, { status: error.statusCode, error: err });
|
||||
return { Component, data, redirect: null };
|
||||
});
|
||||
}
|
||||
|
||||
Object.assign(data, preloaded)
|
||||
return { Component, data, redirect };
|
||||
});
|
||||
}
|
||||
|
||||
function navigate(target: Target, id: number) {
|
||||
if (id) {
|
||||
// popstate or initial navigation
|
||||
cid = id;
|
||||
} else {
|
||||
// clicked on a link. preserve scroll state
|
||||
scroll_history[cid] = scroll_state();
|
||||
|
||||
id = cid = ++uid;
|
||||
scroll_history[cid] = { x: 0, y: 0 };
|
||||
}
|
||||
|
||||
cid = id;
|
||||
|
||||
const loaded = prefetching && prefetching.href === target.url.href ?
|
||||
prefetching.promise :
|
||||
target.route.load().then(mod => prepare_route(mod.default, target.data));
|
||||
|
||||
prefetching = null;
|
||||
|
||||
const token = current_token = {};
|
||||
|
||||
return loaded.then(({ Component, data, redirect }) => {
|
||||
if (redirect) {
|
||||
return goto(redirect.location, { replaceState: true });
|
||||
}
|
||||
|
||||
render(Component, data, scroll_history[id], token);
|
||||
});
|
||||
}
|
||||
|
||||
function handle_click(event: MouseEvent) {
|
||||
// Adapted from https://github.com/visionmedia/page.js
|
||||
// MIT license https://github.com/visionmedia/page.js#license
|
||||
if (which(event) !== 1) return;
|
||||
if (event.metaKey || event.ctrlKey || event.shiftKey) return;
|
||||
if (event.defaultPrevented) return;
|
||||
|
||||
const a: HTMLAnchorElement | SVGAElement = <HTMLAnchorElement | SVGAElement>findAnchor(<Node>event.target);
|
||||
if (!a) return;
|
||||
|
||||
// check if link is inside an svg
|
||||
// in this case, both href and target are always inside an object
|
||||
const svg = typeof a.href === 'object' && a.href.constructor.name === 'SVGAnimatedString';
|
||||
const href = String(svg ? (<SVGAElement>a).href.baseVal : a.href);
|
||||
|
||||
if (href === window.location.href) {
|
||||
event.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
// Ignore if tag has
|
||||
// 1. 'download' attribute
|
||||
// 2. rel='external' attribute
|
||||
if (a.hasAttribute('download') || a.getAttribute('rel') === 'external') return;
|
||||
|
||||
// Ignore if <a> has a target
|
||||
if (svg ? (<SVGAElement>a).target.baseVal : a.target) return;
|
||||
|
||||
const url = new URL(href);
|
||||
|
||||
// Don't handle hash changes
|
||||
if (url.pathname === window.location.pathname && url.search === window.location.search) return;
|
||||
|
||||
const target = select_route(url);
|
||||
if (target) {
|
||||
navigate(target, null);
|
||||
event.preventDefault();
|
||||
history.pushState({ id: cid }, '', url.href);
|
||||
}
|
||||
}
|
||||
|
||||
function handle_popstate(event: PopStateEvent) {
|
||||
scroll_history[cid] = scroll_state();
|
||||
|
||||
if (event.state) {
|
||||
const url = new URL(window.location.href);
|
||||
const target = select_route(url);
|
||||
navigate(target, event.state.id);
|
||||
} else {
|
||||
// hashchange
|
||||
cid = ++uid;
|
||||
history.replaceState({ id: cid }, '', window.location.href);
|
||||
}
|
||||
}
|
||||
|
||||
let prefetching: {
|
||||
href: string;
|
||||
promise: Promise<{ Component: ComponentConstructor, data: any }>;
|
||||
} = null;
|
||||
|
||||
export function prefetch(href: string) {
|
||||
const selected = select_route(new URL(href));
|
||||
|
||||
if (selected) {
|
||||
prefetching = {
|
||||
href,
|
||||
promise: selected.route.load().then(mod => prepare_route(mod.default, selected.data))
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
function handle_touchstart_mouseover(event: MouseEvent | TouchEvent) {
|
||||
const a: HTMLAnchorElement = <HTMLAnchorElement>findAnchor(<Node>event.target);
|
||||
if (!a || a.rel !== 'prefetch') return;
|
||||
|
||||
prefetch(a.href);
|
||||
}
|
||||
|
||||
let inited: boolean;
|
||||
|
||||
export function init(_target: Node, _routes: Route[]) {
|
||||
target = _target;
|
||||
routes = _routes.filter(r => !r.error);
|
||||
errors = {
|
||||
'4xx': _routes.find(r => r.error === '4xx'),
|
||||
'5xx': _routes.find(r => r.error === '5xx')
|
||||
};
|
||||
|
||||
if (!inited) { // this check makes HMR possible
|
||||
window.addEventListener('click', handle_click);
|
||||
window.addEventListener('popstate', handle_popstate);
|
||||
|
||||
// prefetch
|
||||
window.addEventListener('touchstart', handle_touchstart_mouseover);
|
||||
window.addEventListener('mouseover', handle_touchstart_mouseover);
|
||||
|
||||
inited = true;
|
||||
}
|
||||
|
||||
return Promise.resolve().then(() => {
|
||||
const { hash, href } = window.location;
|
||||
|
||||
const deep_linked = hash && document.getElementById(hash.slice(1));
|
||||
scroll_history[uid] = deep_linked ?
|
||||
{ x: 0, y: deep_linked.getBoundingClientRect().top } :
|
||||
scroll_state();
|
||||
|
||||
history.replaceState({ id: uid }, '', href);
|
||||
|
||||
const target = select_route(new URL(window.location.href));
|
||||
return navigate(target, uid);
|
||||
});
|
||||
}
|
||||
|
||||
export function goto(href: string, opts = { replaceState: false }) {
|
||||
const target = select_route(new URL(href, window.location.href));
|
||||
if (target) {
|
||||
navigate(target, null);
|
||||
if (history) history[opts.replaceState ? 'replaceState' : 'pushState']({ id: cid }, '', href);
|
||||
} else {
|
||||
window.location.href = href;
|
||||
}
|
||||
}
|
||||
@@ -1,29 +0,0 @@
|
||||
export type Params = Record<string, string>;
|
||||
export type Query = Record<string, string | true>;
|
||||
export type RouteData = { params: Params, query: Query };
|
||||
|
||||
export interface ComponentConstructor {
|
||||
new (options: { target: Node, data: any, hydrate: boolean }): Component;
|
||||
preload: (data: { params: Params, query: Query }) => Promise<any>;
|
||||
};
|
||||
|
||||
export interface Component {
|
||||
destroy: () => void;
|
||||
}
|
||||
|
||||
export type Route = {
|
||||
pattern: RegExp;
|
||||
params: (match: RegExpExecArray) => Record<string, string>;
|
||||
load: () => Promise<{ default: ComponentConstructor }>
|
||||
};
|
||||
|
||||
export type ScrollPosition = {
|
||||
x: number;
|
||||
y: number;
|
||||
};
|
||||
|
||||
export type Target = {
|
||||
url: URL;
|
||||
route: Route;
|
||||
data: RouteData;
|
||||
};
|
||||
@@ -1,19 +0,0 @@
|
||||
export function detach(node: Node) {
|
||||
node.parentNode.removeChild(node);
|
||||
}
|
||||
|
||||
export function findAnchor(node: Node) {
|
||||
while (node && node.nodeName.toUpperCase() !== 'A') node = node.parentNode; // SVG <a> elements have a lowercase name
|
||||
return node;
|
||||
}
|
||||
|
||||
export function which(event: MouseEvent) {
|
||||
return event.which === null ? event.button : event.which;
|
||||
}
|
||||
|
||||
export function scroll_state() {
|
||||
return {
|
||||
x: window.scrollX,
|
||||
y: window.scrollY
|
||||
};
|
||||
}
|
||||
1
src/types.d.ts
vendored
Normal file
1
src/types.d.ts
vendored
Normal file
@@ -0,0 +1 @@
|
||||
declare module 'svelte/compiler';
|
||||
119
src/utils.ts
Normal file
119
src/utils.ts
Normal file
@@ -0,0 +1,119 @@
|
||||
import * as fs from 'fs';
|
||||
import * as path from 'path';
|
||||
|
||||
export function left_pad(str: string, len: number) {
|
||||
while (str.length < len) str = ` ${str}`;
|
||||
return str;
|
||||
}
|
||||
|
||||
export function repeat(str: string, i: number) {
|
||||
let result = '';
|
||||
while (i--) result += str;
|
||||
return result;
|
||||
}
|
||||
|
||||
export function format_milliseconds(ms: number) {
|
||||
if (ms < 1000) return `${ms}ms`;
|
||||
if (ms < 60000) return `${(ms / 1000).toFixed(1)}s`;
|
||||
|
||||
const minutes = ~~(ms / 60000);
|
||||
const seconds = Math.round((ms % 60000) / 1000);
|
||||
return `${minutes}m${seconds < 10 ? '0' : ''}${seconds}s`;
|
||||
}
|
||||
|
||||
export function elapsed(start: number) {
|
||||
return format_milliseconds(Date.now() - start);
|
||||
}
|
||||
|
||||
export function walk(cwd: string, dir = cwd, files: string[] = []) {
|
||||
fs.readdirSync(dir).forEach(file => {
|
||||
const resolved = path.resolve(dir, file);
|
||||
if (fs.statSync(resolved).isDirectory()) {
|
||||
walk(cwd, resolved, files);
|
||||
} else {
|
||||
files.push(posixify(path.relative(cwd, resolved)));
|
||||
}
|
||||
});
|
||||
|
||||
return files;
|
||||
}
|
||||
|
||||
export function posixify(str: string) {
|
||||
return str.replace(/\\/g, '/');
|
||||
}
|
||||
|
||||
const previous_contents = new Map();
|
||||
|
||||
export function write_if_changed(file: string, code: string) {
|
||||
if (code !== previous_contents.get(file)) {
|
||||
previous_contents.set(file, code);
|
||||
fs.writeFileSync(file, code);
|
||||
fudge_mtime(file);
|
||||
}
|
||||
}
|
||||
|
||||
export function stringify(string: string, includeQuotes: boolean = true) {
|
||||
const quoted = JSON.stringify(string);
|
||||
return includeQuotes ? quoted : quoted.slice(1, -1);
|
||||
}
|
||||
|
||||
export function fudge_mtime(file: string) {
|
||||
// need to fudge the mtime so that webpack doesn't go doolally
|
||||
const { atime, mtime } = fs.statSync(file);
|
||||
fs.utimesSync(
|
||||
file,
|
||||
new Date(atime.getTime() - 999999),
|
||||
new Date(mtime.getTime() - 999999)
|
||||
);
|
||||
}
|
||||
|
||||
export const reserved_words = new Set([
|
||||
'arguments',
|
||||
'await',
|
||||
'break',
|
||||
'case',
|
||||
'catch',
|
||||
'class',
|
||||
'const',
|
||||
'continue',
|
||||
'debugger',
|
||||
'default',
|
||||
'delete',
|
||||
'do',
|
||||
'else',
|
||||
'enum',
|
||||
'eval',
|
||||
'export',
|
||||
'extends',
|
||||
'false',
|
||||
'finally',
|
||||
'for',
|
||||
'function',
|
||||
'if',
|
||||
'implements',
|
||||
'import',
|
||||
'in',
|
||||
'instanceof',
|
||||
'interface',
|
||||
'let',
|
||||
'new',
|
||||
'null',
|
||||
'package',
|
||||
'private',
|
||||
'protected',
|
||||
'public',
|
||||
'return',
|
||||
'static',
|
||||
'super',
|
||||
'switch',
|
||||
'this',
|
||||
'throw',
|
||||
'true',
|
||||
'try',
|
||||
'typeof',
|
||||
'var',
|
||||
'void',
|
||||
'while',
|
||||
'with',
|
||||
'yield',
|
||||
]);
|
||||
7
test/app/.gitignore
vendored
7
test/app/.gitignore
vendored
@@ -1,7 +0,0 @@
|
||||
.DS_Store
|
||||
node_modules
|
||||
.sapper
|
||||
yarn.lock
|
||||
cypress/screenshots
|
||||
templates/.*
|
||||
dist
|
||||
@@ -1,81 +0,0 @@
|
||||
# sapper-template
|
||||
|
||||
The default [Sapper](https://github.com/sveltejs/sapper) template. To clone it and get started:
|
||||
|
||||
```bash
|
||||
npx degit sveltejs/sapper-template my-app
|
||||
cd my-app
|
||||
npm install # or yarn!
|
||||
npm run dev
|
||||
```
|
||||
|
||||
Open up [localhost:3000](http://localhost:3000) and start clicking around.
|
||||
|
||||
|
||||
## Structure
|
||||
|
||||
Sapper expects to find three directories in the root of your project — `assets`, `routes` and `templates`.
|
||||
|
||||
|
||||
### assets
|
||||
|
||||
The [assets](assets) directory contains any static assets that should be available. These are served using [serve-static](https://github.com/expressjs/serve-static).
|
||||
|
||||
In your [service-worker.js](templates/service-worker.js) file, Sapper makes these files available as `__assets__` so that you can cache them (though you can choose not to, for example if you don't want to cache very large files).
|
||||
|
||||
|
||||
### routes
|
||||
|
||||
This is the heart of your Sapper app. There are two kinds of routes — *pages*, and *server routes*.
|
||||
|
||||
**Pages** are Svelte components written in `.html` files. When a user first visits the application, they will be served a server-rendered version of the route in question, plus some JavaScript that 'hydrates' the page and initialises a client-side router. From that point forward, navigating to other pages is handled entirely on the client for a fast, app-like feel. (Sapper will preload and cache the code for these subsequent pages, so that navigation is instantaneous.)
|
||||
|
||||
**Server routes** are modules written in `.js` files, that export functions corresponding to HTTP methods. Each function receives Express `request` and `response` objects as arguments, plus a `next` function. This is useful for creating a JSON API, for example.
|
||||
|
||||
There are three simple rules for naming the files that define your routes:
|
||||
|
||||
* A file called `routes/about.html` corresponds to the `/about` route. A file called `routes/blog/[slug].html` corresponds to the `/blog/:slug` route, in which case `params.slug` is available to the route
|
||||
* The file `routes/index.html` (or `routes/index.js`) corresponds to the root of your app. `routes/about/index.html` is treated the same as `routes/about.html`.
|
||||
* Files and directories with a leading underscore do *not* create routes. This allows you to colocate helper modules and components with the routes that depend on them — for example you could have a file called `routes/_helpers/datetime.js` and it would *not* create a `/_helpers/datetime` route
|
||||
|
||||
|
||||
### templates
|
||||
|
||||
This directory should contain the following files at a minimum:
|
||||
|
||||
* [2xx.html](templates/2xx.html) — a template for the page to serve for valid requests
|
||||
* [4xx.html](templates/4xx.html) — a template for 4xx-range errors (such as 404 Not Found)
|
||||
* [5xx.html](templates/5xx.html) — a template for 5xx-range errors (such as 500 Internal Server Error)
|
||||
* [main.js](templates/main.js) — this module initialises Sapper
|
||||
* [service-worker.js](templates/service-worker.js) — your app's service worker
|
||||
|
||||
Inside the HTML templates, Sapper will inject various values as indicated by `%sapper.xxxx%` tags. Inside JavaScript files, Sapper will replace strings like `__dev__` with the appropriate value.
|
||||
|
||||
In lieu of documentation (bear with us), consult the files to see what variables are available and how they're used.
|
||||
|
||||
|
||||
## Webpack config
|
||||
|
||||
Sapper uses webpack to provide code-splitting, dynamic imports and hot module reloading, as well as compiling your Svelte components. As long as you don't do anything daft, you can edit the configuration files to add whatever loaders and plugins you'd like.
|
||||
|
||||
|
||||
## Production mode and deployment
|
||||
|
||||
To start a production version of your app, run `npm start`. This will disable hot module replacement, and activate the appropriate webpack plugins.
|
||||
|
||||
You can deploy your application to any environment that supports Node 8 or above. As an example, to deploy to [Now](https://zeit.co/now), run these commands:
|
||||
|
||||
```bash
|
||||
npm install -g now
|
||||
now
|
||||
```
|
||||
|
||||
|
||||
## Bugs and feedback
|
||||
|
||||
Sapper is in early development, and may have the odd rough edge here and there. Please be vocal over on the [Sapper issue tracker](https://github.com/sveltejs/sapper/issues).
|
||||
|
||||
|
||||
## License
|
||||
|
||||
[LIL](LICENSE)
|
||||
@@ -1,6 +0,0 @@
|
||||
import { init } from '../../../runtime.js';
|
||||
import { routes } from './manifest/client.js';
|
||||
|
||||
window.init = () => {
|
||||
return init(document.querySelector('#sapper'), routes);
|
||||
};
|
||||
@@ -1,78 +0,0 @@
|
||||
import fs from 'fs';
|
||||
import express from 'express';
|
||||
import compression from 'compression';
|
||||
import serve from 'serve-static';
|
||||
import sapper from '../../../middleware';
|
||||
import { routes } from './manifest/server.js';
|
||||
|
||||
let count;
|
||||
let ended;
|
||||
|
||||
process.on('message', message => {
|
||||
if (message.action === 'start') {
|
||||
count = 0;
|
||||
ended = false;
|
||||
process.send({ type: 'ready' });
|
||||
}
|
||||
|
||||
if (message.action === 'end') {
|
||||
ended = true;
|
||||
if (count === 0) process.send({ type: 'done' });
|
||||
}
|
||||
});
|
||||
|
||||
const app = express();
|
||||
|
||||
app.use((req, res, next) => {
|
||||
count += 1;
|
||||
|
||||
const { write, end } = res;
|
||||
const chunks = [];
|
||||
|
||||
res.write = function(chunk) {
|
||||
chunks.push(new Buffer(chunk));
|
||||
write.apply(res, arguments);
|
||||
};
|
||||
|
||||
res.end = function(chunk) {
|
||||
if (chunk) chunks.push(new Buffer(chunk));
|
||||
end.apply(res, arguments);
|
||||
|
||||
count -= 1;
|
||||
|
||||
process.send({
|
||||
method: req.method,
|
||||
url: req.url,
|
||||
status: res.statusCode,
|
||||
headers: res._headers,
|
||||
body: Buffer.concat(chunks).toString()
|
||||
});
|
||||
|
||||
if (count === 0 && ended) {
|
||||
process.send({ type: 'done' });
|
||||
}
|
||||
};
|
||||
|
||||
next();
|
||||
});
|
||||
|
||||
const { PORT = 3000 } = process.env;
|
||||
|
||||
// this allows us to do e.g. `fetch('/api/blog')` on the server
|
||||
const fetch = require('node-fetch');
|
||||
global.fetch = (url, opts) => {
|
||||
if (url[0] === '/') url = `http://localhost:${PORT}${url}`;
|
||||
return fetch(url, opts);
|
||||
};
|
||||
|
||||
app.use(compression({ threshold: 0 }));
|
||||
|
||||
app.use(serve('assets'));
|
||||
|
||||
app.use(sapper({
|
||||
routes
|
||||
}));
|
||||
|
||||
app.listen(PORT, () => {
|
||||
console.log(`listening on port ${PORT}`);
|
||||
});
|
||||
@@ -1,37 +0,0 @@
|
||||
<!doctype>
|
||||
<html lang='en'>
|
||||
<head>
|
||||
<meta charset='utf-8'>
|
||||
<meta name='viewport' content='width=device-width'>
|
||||
<meta name='theme-color' content='#aa1e1e'>
|
||||
|
||||
<link rel='stylesheet' href='/global.css'>
|
||||
<link rel='manifest' href='/manifest.json'>
|
||||
<link rel='icon' type='image/png' href='/favicon.png'>
|
||||
|
||||
<script>
|
||||
// if ('serviceWorker' in navigator) {
|
||||
// navigator.serviceWorker.register('/service-worker.js');
|
||||
// }
|
||||
</script>
|
||||
|
||||
<!-- Sapper generates a <style> tag containing critical CSS
|
||||
for the current page. CSS for the rest of the app is
|
||||
lazily loaded when it precaches secondary pages -->
|
||||
%sapper.styles%
|
||||
|
||||
<!-- This contains the contents of the <:Head> component, if
|
||||
the current page has one -->
|
||||
%sapper.head%
|
||||
</head>
|
||||
<body>
|
||||
<!-- The application will be rendered inside this element,
|
||||
because `templates/main.js` references it -->
|
||||
<div id='sapper'>%sapper.html%</div>
|
||||
|
||||
<!-- Sapper creates a <script> tag containing `templates/main.js`
|
||||
and anything else it needs to hydrate the app and
|
||||
initialise the router -->
|
||||
%sapper.scripts%
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 1.9 KiB |
@@ -1,45 +0,0 @@
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: Roboto, -apple-system, BlinkMacSystemFont, Segoe UI, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
|
||||
font-size: 14px;
|
||||
line-height: 1.5;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
main {
|
||||
position: relative;
|
||||
max-width: 56em;
|
||||
background-color: white;
|
||||
padding: 2em;
|
||||
margin: 0 auto;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
margin: 0 0 0.5em 0;
|
||||
font-weight: 400;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: menlo, inconsolata, monospace;
|
||||
font-size: calc(1em - 2px);
|
||||
color: #555;
|
||||
background-color: #f0f0f0;
|
||||
padding: 0.2em 0.4em;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
@media (min-width: 400px) {
|
||||
body {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 80 KiB |
@@ -1,20 +0,0 @@
|
||||
{
|
||||
"background_color": "#ffffff",
|
||||
"theme_color": "#aa1e1e",
|
||||
"name": "TODO",
|
||||
"short_name": "TODO",
|
||||
"display": "minimal-ui",
|
||||
"start_url": "/",
|
||||
"icons": [
|
||||
{
|
||||
"src": "svelte-logo-192.png",
|
||||
"sizes": "192x192",
|
||||
"type": "image/png"
|
||||
},
|
||||
{
|
||||
"src": "svelte-logo-512.png",
|
||||
"sizes": "512x512",
|
||||
"type": "image/png"
|
||||
}
|
||||
]
|
||||
}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.3 KiB |
4931
test/app/package-lock.json
generated
4931
test/app/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -1,28 +0,0 @@
|
||||
{
|
||||
"name": "TODO",
|
||||
"description": "TODO",
|
||||
"version": "0.0.1",
|
||||
"scripts": {
|
||||
"dev": "node server.js",
|
||||
"build": "sapper build",
|
||||
"start": "cross-env NODE_ENV=production node server.js",
|
||||
"prestart": "npm run build"
|
||||
},
|
||||
"dependencies": {
|
||||
"compression": "^1.7.1",
|
||||
"cross-env": "^5.1.1",
|
||||
"css-loader": "^0.28.7",
|
||||
"express": "^4.16.2",
|
||||
"extract-text-webpack-plugin": "^3.0.2",
|
||||
"glob": "^7.1.2",
|
||||
"marked": "^0.3.9",
|
||||
"node-fetch": "^1.7.3",
|
||||
"npm-run-all": "^4.1.2",
|
||||
"serve-static": "^1.13.1",
|
||||
"style-loader": "^0.19.0",
|
||||
"svelte": "^1.49.1",
|
||||
"svelte-loader": "^2.2.1",
|
||||
"uglifyjs-webpack-plugin": "^1.1.2",
|
||||
"webpack": "^3.10.0"
|
||||
}
|
||||
}
|
||||
@@ -1,18 +0,0 @@
|
||||
<:Head>
|
||||
<title>{{status}}</title>
|
||||
</:Head>
|
||||
|
||||
<Layout page='home'>
|
||||
<h1>Not found</h1>
|
||||
<p>{{error.message}}</p>
|
||||
</Layout>
|
||||
|
||||
<script>
|
||||
import Layout from './_components/Layout.html';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Layout
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,18 +0,0 @@
|
||||
<:Head>
|
||||
<title>Internal server error</title>
|
||||
</:Head>
|
||||
|
||||
<Layout page='home'>
|
||||
<h1>Internal server error</h1>
|
||||
<p>{{error.message}}</p>
|
||||
</Layout>
|
||||
|
||||
<script>
|
||||
import Layout from './_components/Layout.html';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Layout
|
||||
}
|
||||
};
|
||||
</script>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user