Skip to content

Commit 14b0156

Browse files
Address PR comments: update rx.asset documentation
Co-Authored-By: Alek Petuskey <[email protected]>
1 parent 37bd82e commit 14b0156

File tree

3 files changed

+8
-14
lines changed

3 files changed

+8
-14
lines changed

docs/assets/overview.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ Shared assets are placed next to your Python file and are linked to the app's ex
5858
# my_component.py
5959
import reflex as rx
6060

61-
# my_script.js is located next to this Python file
61+
# my_script.js is located in the same directory as this Python file
6262
def my_component():
6363
return rx.box(
6464
rx.script(src=rx.asset("my_script.js", shared=True)),

docs/assets/upload_and_download_files.md

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ rx.table.root(
5757
rx.table.row(
5858
rx.table.cell(rx.text("When to Use", font_weight="bold")),
5959
rx.table.cell(rx.text("For files that are part of your application's codebase")),
60-
rx.table.cell(rx.text("For files that users upload through your application")),
60+
rx.table.cell(rx.text("For files that users upload or generate through your application")),
6161
),
6262
rx.table.row(
6363
rx.table.cell(rx.text("Availability", font_weight="bold")),
@@ -69,11 +69,7 @@ rx.table.root(
6969
)
7070
```
7171

72-
```md alert
73-
# Assets are primarily intended for frontend use
7472

75-
Assets in Reflex are primarily intended for frontend use and are not expected to be read from the backend. When assets are needed in both frontend and backend, they are currently copied to the backend (though this behavior may change in future versions).
76-
```
7773

7874
For more information about assets, see the [Assets Overview](/docs/assets/overview/).
7975

docs/wrapping-react/guide.md

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -441,28 +441,26 @@ def index():
441441

442442
## Assets
443443

444-
_Experimental feature added in v0.5.3_.
445-
446444
If a wrapped component depends on assets such as images, scripts, or
447-
stylesheets, these can kept adjacent to the component code and
448-
included in the final build using the `rx._x.asset` function.
445+
stylesheets, these can be kept adjacent to the component code and
446+
included in the final build using the `rx.asset` function.
449447

450-
`rx._x.asset` returns a relative path that references the asset in the compiled
448+
`rx.asset` returns a relative path that references the asset in the compiled
451449
output. The target files are copied into a subdirectory of `assets/external`
452450
based on the module where they are initially used. This allows third-party
453451
components to have external assets with the same name without conflicting
454452
with each other.
455453

456454
For example, if there is an SVG file named `wave.svg` in the same directory as
457-
this component, it can be rendered using `rx.image` and `rx._x.asset`.
455+
this component, it can be rendered using `rx.image` and `rx.asset`.
458456

459457
```python
460458
class Hello(rx.Component):
461459
@classmethod
462460
def create(cls, *children, **props) -> rx.Component:
463461
props.setdefault("align", "center")
464462
return rx.hstack(
465-
rx.image(src=rx._x.asset("wave.svg"), width="50px", height="50px"),
463+
rx.image(src=rx.asset("wave.svg", shared=True), width="50px", height="50px"),
466464
rx.heading("Hello ", *children),
467465
**props
468466
)
@@ -471,4 +469,4 @@ class Hello(rx.Component):
471469

472470
## Debugging
473471

474-
If you encounter an error while wrapping a component it is recommended to check the Console in the browser developer tools. You can access this by going to inspect element and then clicking on the Console tab on Mac. This is because the Console is where most Javascript errors are logged.
472+
If you encounter an error while wrapping a component it is recommended to check the Console in the browser developer tools. You can access this by going to inspect element and then clicking on the Console tab on Mac. This is because the Console is where most Javascript errors are logged.

0 commit comments

Comments
 (0)