Soul-vite-js-hash NPM

soul-vite-js-hash

介绍

soul-vite-js-hash是一个vite的插件，用来计算打包后的js的hash，可以配置csp策略

安装

npm i -S soul-vite-js-hash

使用

在入口的index.html文件加上

 <% if(htmlWebpackPlugin.options.isProduction) { %>
      <meta http-equiv="Content-Security-Policy" content="{{CSP-SCRIPT-SRC-HASH}}">
<% } %>

全index.html文件

<!DOCTYPE html>
<html lang="">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title><%= htmlWebpackPlugin.options.title %></title>
    <% if(htmlWebpackPlugin.options.isProduction) { %>
      <meta http-equiv="Content-Security-Policy" content="{{CSP-SCRIPT-SRC-HASH}}">
    <% } %>
  </head>
  <body>
    <div id="app"></div>
  </body>
</html>

vite.config.js

import { fileURLToPath, URL } from 'node:url'

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

import HashPlugin from 'soul-vite-js-hash'

const csp_option = {
  'script-src': 'self {{CSP-SCRIPT-SRC-HASH}}'
}


export default defineConfig({
  plugins: [
    vue(),
    HashPlugin(csp_option),
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  }
})

参数说明

HashPlugin(csp_option)

//如果没有传csp_option，参数默认值是
const csp_option = {
  'script-src': 'self {{CSP-SCRIPT-SRC-HASH}}'
}
// {{CSP-SCRIPT-SRC-HASH}} 是js hash的占位符，目前只提供js hash的计算，当然你也可以进行其他的csp配置，具体如何配置，请自行查阅csp

11 days ago

2 months ago

2 months ago

2 months ago

2 months ago