henriquesati
How to deliver static js and css into html to client
I’m confused about the flow of serving the client fully in js/css/html
i’m placing home.js and home.css both inside assets/js and assets/css
and modifie my config to include them in the bundling
config :tailwind,
version: "3.4.3",
testespay: [
args: ~w(
--config=tailwind.config.js
--input=css/app.css
--input=css/home.css
--output=../priv/static/assets/app.css
),
cd: Path.expand("../assets", __DIR__)
]
config :esbuild,
version: "0.17.11",
testespay: [
args:
~w(js/app.js js/home.js --bundle --target=es2017 --outdir=../priv/static/assets --external:/fonts/* --external:/images/*),
cd: Path.expand("../assets", __DIR__),
env: %{"NODE_PATH" => Path.expand("../deps", __DIR__)}
]
but now how do I import it into a html and deliver to client?
I made some mods to Endpoint but I confess that for now i have no idea of this is supposed to work
plug Plug.Static,
at: "/",
from: :testespay,
gzip: false,
only: TestespayWeb.static_paths()
plug Plug.Static,
at: "/home",
from: :testespay,
gzip: false,
only: ~w(assets home.html)
defmodule TestespayWeb.Router do
use TestespayWeb, :router
pipeline :browser do
...
end
pipeline :api do
plug :accepts, ["json"]
end
scope "/", TestespayWeb do
pipe_through :browser
get "/home", HomeController, :show
end
scope "/api", TestespayWeb do
pipe_through :api
post "/create_contract", ContractController, :create
get "/identify", IdentifyController, :find
end
my controller
defmodule TestespayWeb.HomeController do
use TestespayWeb, :controller
def show(conn, _params) do
conn
|> put_resp_content_type("text/html")
|> send_file(200, Path.join(:code.priv_dir(:testespay), "static/home/index.html"))
end
end
now looking at the console on the browser, it’s looks like i’m seding my js and my css as files ( I can see the assets folder in my console directories) but my html file that is returned doesnt have neither js or css files
priv/
└── static/
├── assets/
│ ├── home.css
│ ├── home.js
└── templates/
└── home/
└── index.html.
and i’m importing with this syntax
and
First Post!
henriquesati
The problem was the path for the css and js
<link rel="stylesheet" href="../assets/app.css">
but now I dont know why to use the Plug.static as in
plug Plug.Static,
at: "/home",
from: :testespay,
gzip: false,
only: ~w(assets home.html)
if I can get my page in that way.
there is a better way to do it?
Last Post!
henriquesati
yes thats the point, I didnt understand much when to use plugstatic since I could get it working on the previous way I explained.
Popular in Questions
Other popular topics
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #deployment
- #library
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #channels
- #elixirconf
- #exunit
- #discussion
- #code-sync
- #javascript
- #podcasts
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #elixir-ls
- #phoenix_html
- #iex
- #blog-post
- #graphql
- #genstage
- #ai
- #websockets
- #supervisor
- #elixirconf-us
- #advent-of-code
- #distillery
- #processes
- #forms
- #api
- #metaprogramming
- #security
- #hex









