# Functions

**url(**path:string**)**: string

依据传入的地址生成一个URL地址，不管组件在何处被使用，这个地址都能正确获取到相对应的资源

| <p>path: string</p><p>当前你要引用的文件相对于你这个项目根目录的路径</p> |
| ------------------------------------------------- |
| <p>returns: string</p><p>一个能够引用到文件的绝对路径</p>       |

```jsx
import * as React from "react"
import { Frame } from "framer"
import { url } from "framer/resource"

export function MyComponent() {
  return (
    <Frame image={url("./code/test.png")} size={"100%"} />
  )
}
```

生成的URL地址会根据你的项目在何处在合适打开来生成正确的地址，所有在组件上使用url这个方法，而不要先用一个变量来存放url方法的返回值。

```jsx
// GOOD: Use a relative path. Call url() within component. 这样是对的使用方式
const image = "./code/test.png"

export function MyComponent() {
  return <Frame image={url(image)} size={"100%"} />
}
```

```jsx
// BAD: Avoid this. The returned url may change over time.  这是错的使用方式
const image = url("./code/test.png")

export function MyComponent() {
  return <Frame image={image} size={"100%"} />
}
```