szrenwei / Inline Manifest Webpack Plugin
Licence: mit
inline your webpack manifest (runtime code) with a script tag to save http request
Stars: ✭ 157
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Inline Manifest Webpack Plugin
Runtimepermission
Simpliest way to ask runtime permissions on Android, no need to extend class or override permissionResult method, choose your way : Kotlin / Coroutines / RxJava / Java7 / Java8
Stars: ✭ 860 (+447.77%)
Mutual labels: manifest, runtime
Crystdb
CrystDB is a thread-safe and convenient Object Relational Mapping database that based on SQLite.
Stars: ✭ 146 (-7.01%)
Mutual labels: runtime
Nicelinks Vue Client
🐬 很棒的 Web 应用——倾城之链(NICE LINKS),基于 Vue2.*(Webpack、Es6、Element-ui)所构建
Stars: ✭ 133 (-15.29%)
Mutual labels: webpack4
163music
🎵163 music web app built with Vue 2.6, server side render, webpack 4
Stars: ✭ 139 (-11.46%)
Mutual labels: webpack4
React Redux Bootstrap Webpack Starter
React 16.9 + Typescript + React-Router 4 + Redux + Bootstrap 4 + Hot Reload + redux-devtools-extension + Webpack 4 + styled-components STARTER
Stars: ✭ 133 (-15.29%)
Mutual labels: webpack4
Swizzleswift
Swizzle selectors with just one clean and elegant API
Stars: ✭ 140 (-10.83%)
Mutual labels: runtime
Reactql
Universal React+GraphQL starter kit: React 16, Apollo 2, MobX, Emotion, Webpack 4, GraphQL Code Generator, React Router 4, PostCSS, SSR
Stars: ✭ 1,833 (+1067.52%)
Mutual labels: webpack4
Rapidgui
Unity OnGUI(IMGUI) extensions for Rapid prototyping/development
Stars: ✭ 144 (-8.28%)
Mutual labels: runtime
Next Runtime Dotenv
Expose environment variables to the runtime config of Next.js
Stars: ✭ 136 (-13.38%)
Mutual labels: runtime
Webpack Internal Plugin Relation
🔎 a tiny tool to show the relation of webpack internal plugins & hooks
Stars: ✭ 135 (-14.01%)
Mutual labels: webpack4
Vue 2 Webpack 4 Boilerplate
Ready to use Vue 2+ project with webpack 4 configuration for development and production
Stars: ✭ 142 (-9.55%)
Mutual labels: webpack4
Webpack Babel Multi Target Plugin
A Webpack plugin that works with Babel to allow differential loading - production deployment of ES2015 builds targeted to modern browsers, with an ES5 fallback for legacy browsers.
Stars: ✭ 150 (-4.46%)
Mutual labels: webpack4
Vue Element Quick Start
Vue2, Vuex 3, Vue Router 3, Element-ui and Typescript SPA project quick start kit(Vue element ui 快速开始脚手架)
Stars: ✭ 135 (-14.01%)
Mutual labels: webpack4
React Webpack4 Cook
💯The most powerful webpack4 tutorial in the universe
Stars: ✭ 152 (-3.18%)
Mutual labels: webpack4
Inline Manifest Webpack Plugin
This is a webpack plugin that inline your manifest.js with a script tag to save http request. Cause webpack's runtime always change between every build, it's better to split the runtime code out for long-term caching.
Installation
Install the plugin with npm:
$ npm i inline-manifest-webpack-plugin -D
Basic Usage
This plugin need to work with webpack v4 (for webpack v3 and below, pls use version 3) and HtmlWebpackPlugin v3 :
Step1: split out the runtime code
// the default name is "runtime"
optimization: {
runtimeChunk: 'single'
}
// or specify another name
optimization: {
runtimeChunk: {
name: 'another name'
}
}
Step2: add plugins:
// this plugin need to put after HtmlWebpackPlugin
[
new HtmlWebpackPlugin(),
new InlineManifestWebpackPlugin()
]
or
[
new HtmlWebpackPlugin(),
// if you changed the runtimeChunk's name, you need to sync it here
new InlineManifestWebpackPlugin('another name')
]
Done! This will replace the external script with inline code.
One more thing
if you use inject: false
in your HtmlWebpackPlugin
, you can access the runtime code like this:
<%= htmlWebpackPlugin.files.runtime %>
<% for (var chunk in htmlWebpackPlugin.files.chunks) { %>
<script src="<%= htmlWebpackPlugin.files.chunks[chunk].entry %>"></script>
<% } %>
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].