@@ -10,7 +10,63 @@ icon: 'square-terminal'
1010
1111Starts a local development server that will watch your files and automatically rebuild your email when you make changes.
1212
13- ** Options**
13+ ### Where can I place my static files for previewing
14+
15+ Almost always you will need to have static files in your emails, and seeing
16+ them on the preview server without having to first host on a CDN is very helpful.
17+
18+ We do allow for this, and currently, you can place your files inside of a ` static `
19+ directory inside of your ` emails ` directory.
20+
21+ This does adjust to your ` --dir ` option, so if your ` emails ` directory was inside
22+ of ` ./src/emails ` , you would place your static files inside of ` ./src/emails/static ` .
23+
24+ These static files are directly served from our preview server by looking into the
25+ requests made into that end with ` /static ` and serving the files at that point,
26+ this also allows for you to have images inside of your emails like so:
27+
28+ ``` jsx
29+ export default Email (props) {
30+ return (
31+ < div>
32+ < img src= " /static/email-logo.png" / >
33+ < / div>
34+ )
35+ }
36+ ```
37+
38+ ### How to make the preview server ignore directories
39+
40+ Once the preview server has started and is now open on ` localhost ` , the preview server
41+ reads recursively down into all of your files and directories. This can be disabled
42+ from a directory down by prefixing it with ` _ ` , e.g. ` components -> _components ` . So if you wanted
43+ to make components for your emails, you could make a structure as follows:
44+
45+ ``` bash
46+ my-project
47+ βββ emails
48+ β βββ _components
49+ β β βββ this-is-not-going-to-appear-in-the-sidebar.tsx
50+ β βββ email.tsx
51+ β βββ static
52+ βββ package.json
53+ βββ tsconfig.json
54+ ```
55+
56+ ### The heuristics for files to be considered emails
57+
58+ To avoid uncanny files appearing in the sidebar of the preview server,
59+ we account for two heuristics to determine weather or not we should
60+ include it:
61+
62+ 1 . If file has ` .js, .jsx or .tsx ` file extensions
63+ 2 . If the file contains a ` export default ` expression by matching with the regex <br />
64+ ` /\bexport\s*default\b/gm `
65+
66+ These can certainly fail as they are only heuristics, so if you do find
67+ any issues with these, feel free to open an [ issue] ( https://github.com/resend/react-email/issues ) .
68+
69+ ### Options
1470
1571<ResponseField name = " --dir" type = " string" default = " emails" >
1672 Change the directory of your email templates.
0 commit comments