Re: [Videlibri-xidel] Extract css into separate files?
Client for public libraries
Brought to you by:
benibela
Menu
▾
▴
Re: [Videlibri-xidel] Extract css into separate files?
|
From: Peng Yu <pen...@gm...> - 2023-05-07 23:06:18
|
On 5/7/23, Reino Wijnsma <rwi...@xs...> wrote: > Hello Peng, > > On 2023-05-07T16:05:19+0200, Peng Yu <pen...@gm...> wrote: >> The output of the main html should be something like this. >> >> <!DOCTYPE html> >> <html> >> <head> >> <link rel="stylesheet" href="css/1.css"> >> <link rel="stylesheet" href="css/2.css"> >> <link rel="stylesheet" href="css/3.css"> >> </head> >> <body> >> >> <h1>This is a heading</h1> >> <p>This is a paragraph.</p> >> >> </body> >> </html> > > Xidel has support for the EXPath File Module > <https://www.benibela.de/documentation/internettools/xpath-functions.html#modulefile>, > which is perfect for creating the css-files: > > $ xidel -s 1.html -e ' > file:create-dir("css"), > for $x at $i in //style/normalize-space() return > file:write-text(`css/{$i}.css`,$x) > ' If I want to save CSS files to a directory whose name is given as a bash variable (which may contain quotations or other special characters), what is the proper way to pass that variable to xidel? > First create the "css"-map, then iterate over the "style" text-nodes and > write each to disk. > If you're not using the latest development-build, then use x"css/{$i}.css" > instead of `css/{$i}.css`. > Then with... > > $ xidel -se 'file:list("css")' > 1.css > 2.css > 3.css > > ...you should see the content of the newly created "css"-map. > > I suggest you first remove all "style" element-nodes, feed the output to > another x:replace-nodes(), and then finally replace the entire "head" > element-node: > > $ xidel -s 1.html -e ' > x:replace-nodes(//style,())/x:replace-nodes( > //head, > <head>{ > for $x in file:list("css") return > <link rel="stylesheet" href="css/{$x}"/> > }</head> > ) > ' --output-format=html --output-node-indent > <!DOCTYPE html> > <html> > <head> > <link rel="stylesheet" href="css/1.css"> > <link rel="stylesheet" href="css/2.css"> > <link rel="stylesheet" href="css/3.css"> > </head> > <body> > <h1>This is a heading</h1> > <p>This is a paragraph.</p> > </body> > </html> > > - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - > - - - - - - - - - - > > I've also tried to directly replace the "style" element-nodes, but that > won't work, because then every single "style" element-node will be replaced > by 3 "link" element-node: > > $ xidel -s 1.html -e ' > x:replace-nodes( > //style, > for $x in file:list("css") return > <link rel="stylesheet" href="css/{$x}"/> > ) > ' --output-format=html --output-node-indent > <!DOCTYPE html> > <html> > <head> > <link rel="stylesheet" href="css/1.css"> > <link rel="stylesheet" href="css/2.css"> > <link rel="stylesheet" href="css/3.css"> > <link rel="stylesheet" href="css/1.css"> > <link rel="stylesheet" href="css/2.css"> > <link rel="stylesheet" href="css/3.css"> > <link rel="stylesheet" href="css/1.css"> > <link rel="stylesheet" href="css/2.css"> > <link rel="stylesheet" href="css/3.css"> > </head> > <body> > <h1>This is a heading</h1> > <p>This is a paragraph.</p> > </body> > </html> > > - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - > - - - - - - - - - - > > Finally, you can combine above 2 Xidel-commands into 1 command with 2 > extraction-queries: > > $ xidel -s 1.html \ > -e ' > file:create-dir("css"), > for $x at $i in //style/normalize-space() return > file:write-text(`css/{$i}.css`,$x) > ' \ > -e ' > x:replace-nodes(//style,())/x:replace-nodes( > //head, > <head>{ > for $x in file:list("css") return > <link rel="stylesheet" href="css/{$x}"/> > }</head> > ) > ' --output-format=html --output-node-indent > > -- > Reino > > -- Regards, Peng |
