一款用于包装 Entry 配置的 Webpack 插件

简介: Entrypoint wrapper webpack plugin是一款用于包装 Entry 配置的 Webpack 插件。

Entrypoint wrapper webpack plugin

Description

一款用于包装 Entry 配置的 Webpack 插件。

安装

npm i -D entrypoint-wrapper-webpack-plugin

用法

const EntryPoint = require('entrypoint-wrapper-webpack-plugin');
module.exports = {
  entry: {
    'common': ['vue', 'vuex'],
    'my/index': 'src/views/my/index.vue'
  },
  plugins: [
  new EntryPoint({
    include: /.*\.vue$/,
    file: './default_index.js' // wrapper file
  })
  ]
}
const EntryPoint = require('entrypoint-wrapper-webpack-plugin');
module.exports = {
  entry: {
    'common': ['vue', 'vuex'],
    'my/index': 'src/views/my/index.vue'
  },
  plugins: [
  new EntryPoint({
    include: /.*\.vue$/,
    // template string
    template: 'import Main from '<%= origin %>';Main.el = '#root';new Vue(Main)'
  })
  ]
}
const EntryPoint = require('entrypoint-wrapper-webpack-plugin');
module.exports = {
  entry: {
    'common': ['vue', 'vuex'],
    'my/index': 'src/views/my/index.vue'
  },
  plugins: [
  new EntryPoint({
    include: /.*\.vue$/,
    // template function
    template: function(params){
      return `import Main from '${params.origin}';Main.el = '#root';new Vue(Main)`
    }
  })
  ]
}

选项

姓名 类型 默认 描述
skipExistFiles {Boolean} false 跳过现有文件
include {RegExp} /.*/ 包含的文件
file {String} '' 包装路径
template {Function,String} '' 包装模板
相关文章
|
13天前
|
前端开发
【专栏】`webpack` 的 `DefinePlugin` 插件用于在编译时动态定义全局变量,实现环境变量差异化、配置参数动态化和条件编译
【4月更文挑战第29天】`webpack` 的 `DefinePlugin` 插件用于在编译时动态定义全局变量,实现环境变量差异化、配置参数动态化和条件编译。通过配置键值对,如 `ENV: JSON.stringify(process.env.NODE_ENV)`,可以在代码中根据环境执行相应逻辑。实际应用包括动态加载资源、动态配置接口地址和条件编译优化代码。注意变量定义的合法性和避免覆盖,解决变量未定义或值错误的问题,以提升开发效率和项目质量。
|
13天前
|
缓存 JavaScript 前端开发
webpack学习笔记--基本配置
webpack学习笔记--基本配置
|
18天前
|
JavaScript 前端开发
构建工具:配置Webpack打包Vue项目
【4月更文挑战第24天】本文介绍了如何配置Webpack来打包Vue项目。首先,Webpack作为模块打包器处理依赖并打包成可执行文件。接着,通过安装Node.js和npm,创建Vue项目,进入项目目录并配置Webpack的入口、输出、加载器和插件。最后,运行构建命令完成打包。理解Webpack基础并按需配置,能优化前端项目构建和开发体验。
|
2月前
|
存储 前端开发 文件存储
webpack成长指北第5章---webpack的基础配置
webpack成长指北第5章---webpack的基础配置
27 0
|
4月前
|
人工智能 移动开发 前端开发
【利用AI让知识体系化】Webpack 相关配置技巧(三)
【利用AI让知识体系化】Webpack 相关配置技巧
|
4月前
|
人工智能 缓存 JavaScript
【利用AI让知识体系化】Webpack 相关配置技巧(二)
【利用AI让知识体系化】Webpack 相关配置技巧
|
4月前
|
人工智能 前端开发 JavaScript
【利用AI让知识体系化】Webpack 相关配置技巧(一)
【利用AI让知识体系化】Webpack 相关配置技巧
|
4月前
|
前端开发 JavaScript 开发者
webpack打包机制,构建过程和配置
webpack打包机制,构建过程和配置
20 0
|
5月前
|
JavaScript 应用服务中间件 nginx
nginx vue2+webpack 和 vue3+vite 配置二级目录访问
nginx vue2+webpack 和 vue3+vite 配置二级目录访问
140 0
|
5月前
|
JSON JavaScript 前端开发
Webpack的ts的配置详细教程
Webpack的ts的配置详细教程
51 0