带有 esbuild 的 Ruby on Rails 7 rails new app-rails7 -j esbuild -d postgresql
在 package.json 上生成
# package.json
"build": "esbuild app/javascript/*.* --bundle --sourcemap --outdir=app/assets/builds --public-path=assets"
# Procfile.dev
web: unset PORT && bin/rails server
js: yarn build --watch
在 app/assets/builds/application.js 中生成构建文件
在布局中呈现 app/views/layouts/application.html.erb
<%= javascript_include_tag "application", "data-turbo-track": "reload", defer: true %>
More 当我需要分成两个以上加载js文件怎么解决?
我想做什么
app/assets/builds/application.js
app/assets/builds/admin_load.js
经过大量研究并进行了几次测试以得出我想要的结果以达到对我的情况有用的东西。
# package.json
"scripts": {
"build": "esbuild app/javascript/application.js --bundle --minify --analyze=verbose --sourcemap --outdir=app/assets/builds --public-path=assets",
"build_admin": "esbuild app/javascript/admin_load.js --watch --bundle --minify --analyze=verbose --sourcemap --outfile=app/assets/builds --public-path=assets"
}
在 Procfile.dev 中开发中添加行
js_admin: yarn build_admin --watch
不然可以这样
# package.json
"scripts": {
"build": "esbuild app/javascript/application.js app/javascript/admin_load.js --bundle --minify --analyze=verbose --sourcemap --outdir=app/assets/builds --public-path=assets"
}
这样我们就可以在不同的模板中调用两个js文件加载
# app/views/layouts/application.html.erb
<%= javascript_include_tag "application", "data-turbo-track": "reload", defer: true %>
# app/views/layouts/admin.html.erb
<%= javascript_include_tag "admin_load", "data-turbo-track": "reload", defer: true %>
我们仍然可以执行 rake 任务以在任务中添加新的 admin_load.js 构建 轨道资产:预编译
# lib/tasks/my_task.rake
namespace :javascript do
desc "Build your JavaScript bundle"
task :build do
system "yarn install && yarn run build_admin"
end
end
Rake::Task["assets:precompile"].enhance(["javascript:build"])