ali322 / inject-html-webpack-plugin Goto Github PK
View Code? Open in Web Editor NEWinject script label and style links into your html
inject script label and style links into your html
I'm currently using sw cache plugin to load the sw cache worker. I'm following the instructions there (copy the snippet to the bottom of the page:
<script>
if ('serviceWorker' in navigator) {
navigator.serviceWorker
.register("/sw-cache.js")
.then(function() {
console.log('Service worker registered!');
})
.catch(function(error) {
console.log('Error registering service worker: ', error);
});
}
</script>
which is fine, but doesn't take advantage of contenthash resource names from webpack. Now, creating the fingerprint sw cache is easy, injecting it in the template is not. Is there a way to inject all of this text to the bottom of my template while rewriting the "/sw-cache-js"
path?
I've used multiple instances of your plugin and always need to set my publicPath via the transducer
option.
What do you think about considering the publicPath of the webpack config and use it if transducer
is not set?
When I build my app, the plugin works but the built index.html lags behind the injected index.html source
For example, using the settings below, when I build my app at 12:00PM, the built index.html will have <html lang="en">
in build/index.html
even though ./app/index.html
will have the correctly injected html <html lang="en" version="12:00PM">
.
If I build again at 12:05PM, build/index.html
will have <html lang="en" version="12:00PM">
, not <html lang="en" version="12:05PM">
(./app/index.html
will have the correctly injected html <html lang="en" version="12:05PM">
.
Am I doing something wrong? I can't change my filename
to build/index.html
because the build process strips out comments and thus there's no injection point. What can I do to correctly attach version #'s?
webpack config
new InjectHtmlPlugin({
filename: './app/index.html',
customInject: [{
start: '<!-- start:version-number -->',
end: '<!-- end:version-number -->',
content: `<html lang="en" version="${moment().format('MMMM Do YYYY, h:mm:ss a')}">`,
}],
}),
./app/index.html
<!-- start:version-number -->
<html lang="en">
<!-- end:version-number -->
I have a master template and multiple partial views. How can I inject them into the master?
What does processor
do? It is not described in the readme
I need a way of being able to also add a query string to the generated scripts, to overcome caching issues.
Would it be possible that when setting up the InjectHtmlPlugin configs I can specify additional query strings that are then added in the html script lines please?
e.g something similar to the below:
new InjectHtmlPlugin({ /*this is repeated for each view */
filename: ....
processor: ...
chunks: ...
queryString: "v=0.1"
}),
and then it inserts
<script src="...js?v=0.1"></script>Thanks.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.