我如何将Svelte构建的CSS置于常规资产CSS管道
我用Esbuild制作了一个新的Rails 7应用程序:
rails new myapp -j esbuild
package.json
:
{
"name": "app",
"private": "true",
"dependencies": {
"@hotwired/stimulus": "^3.0.1",
"@hotwired/turbo-rails": "^7.1.3",
"esbuild": "^0.14.43",
"esbuild-svelte": "^0.7.1",
"sass": "^1.52.3",
"svelte": "^3.48.0",
"svelte-preprocess": "^4.10.7"
},
"scripts": {
"build": "node ./esbuild.config.js"
}
}
esbuild.config.js
:
#!/usr/bin/env node
var watch = process.argv.includes("--watch");
var esbuild = require('esbuild')
var esbuildSvelte = require('esbuild-svelte');
var sveltePreprocess = require('svelte-preprocess');
esbuild
.build({
entryPoints: ["app/javascript/application.js"],
bundle: true,
outfile: "app/assets/builds/all.js",
// outdir: "app/assets/builds/",
plugins: [
esbuildSvelte({
preprocess: sveltePreprocess(),
}),
],
logLevel: "debug",
watch: watch
})
.catch(() => process.exit(1));
它有效,但all.css
/文件夹不包含在我的CSS中。它包含Sevelte处理的Sass到CSS。
我有默认的subtest.js
:
//= link_tree ../images
//= link_directory ../stylesheets .css
//= link_tree ../builds
它包括构建,但仅适用于JS,而不是
我尝试添加的CSS:*= require ../builds/all.csss
to application.css
:
/*
*= require_tree .
*= require_self
*= require ../builds/all.css
*/
但是我得到此错误:
找不到文件'../builds/all.css'offe
无法找到文件 CSS管道(application.css
)?
I made a new rails 7 app with esbuild:
rails new myapp -j esbuild
package.json
:
{
"name": "app",
"private": "true",
"dependencies": {
"@hotwired/stimulus": "^3.0.1",
"@hotwired/turbo-rails": "^7.1.3",
"esbuild": "^0.14.43",
"esbuild-svelte": "^0.7.1",
"sass": "^1.52.3",
"svelte": "^3.48.0",
"svelte-preprocess": "^4.10.7"
},
"scripts": {
"build": "node ./esbuild.config.js"
}
}
esbuild.config.js
:
#!/usr/bin/env node
var watch = process.argv.includes("--watch");
var esbuild = require('esbuild')
var esbuildSvelte = require('esbuild-svelte');
var sveltePreprocess = require('svelte-preprocess');
esbuild
.build({
entryPoints: ["app/javascript/application.js"],
bundle: true,
outfile: "app/assets/builds/all.js",
// outdir: "app/assets/builds/",
plugins: [
esbuildSvelte({
preprocess: sveltePreprocess(),
}),
],
logLevel: "debug",
watch: watch
})
.catch(() => process.exit(1));
It works, but all.css
in builds / folder was not included in my CSS. It contains sevelte processed sass to css.
I have the default manifest.js
:
//= link_tree ../images
//= link_directory ../stylesheets .css
//= link_tree ../builds
It includes builds, but that works only for JS, not CSS
I tried to add: *= require ../builds/all.css
to application.css
:
/*
*= require_tree .
*= require_self
*= require ../builds/all.css
*/
However I get this error:
couldn't find file '../builds/all.css' under '/home/matrix/ruby/competition/app/assets/stylesheets' with type 'text/css'
How do I include svelte built CSS to the regular asset CSS pipeline (application.css
)?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论