https://github.com/maiscrm/html-skeleton-webpack-plugin

This is a plugin to help webpack inject skeleton element and CSS asset into html.
https://github.com/maiscrm/html-skeleton-webpack-plugin

Last synced: 9 months ago
JSON representation

This is a plugin to help webpack inject skeleton element and CSS asset into html.

• Host: GitHub
• URL: https://github.com/maiscrm/html-skeleton-webpack-plugin
• Owner: maiscrm
• License: mit
• Created: 2020-04-23T14:11:37.000Z (about 6 years ago)
• Default Branch: develop
• Last Pushed: 2023-01-07T17:25:23.000Z (over 3 years ago)
• Last Synced: 2025-06-09T13:50:57.652Z (about 1 year ago)
• Language: JavaScript
• Homepage:
• Size: 132 KB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 4
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
[![npm][npm]][npm-url]

# html-skeleton-webpack-plugin

This is a plugin to help webpack to inject skeleton element and CSS asset into html.

## Usage

**webpack.config.js**

```js

const HtmlSkeletonWebpackPlugin = require('html-skeleton-webpack-plugin');

module.exports = {

  entry: 'index.js',

  output: {

    path: __dirname + '/dist',

    filename: 'index_bundle.js'

  },

  plugins: [

    new HtmlWebpackPlugin(),

    new HtmlSkeletonWebpackPlugin({

      cssFilename: 'css/[name].[contenthash].css',

      template: path.resolve(__dirname, 'src/skeleton.vue'),

    }),

  ]

}

```

**index.html**

```html

  

    

    Webpack App

  

  

    


      

    

  


```

This will inject skeleton element into *\* and insert CSS assets into html head

## Options

|Name|Type|Default|Description|

|:--:|:--:|:-----:|:----------|

|**`cssFilename`**|`{String}`|`'sekeleton.[contenthash].css'`|The file to write the CSS asset to. Defaults to `sekeleton.[contenthash].css`.|

|**`template`**|`{String}`||Relative or absolute path to the skeleton template. By default it will use the default loading template.|

## Preview

![preview](./docs/preview.gif)

[npm]: https://img.shields.io/npm/v/@maiscrm/html-skeleton-webpack-plugin.svg

[npm-url]: https://www.npmjs.com/package/@maiscrm/html-skeleton-webpack-plugin