Vue WebPack忽略指定文件或目录方式

 更新时间:2022年04月15日 11:22:13   作者:我爱我家喵喵  
这篇文章主要介绍了Vue WebPack忽略指定文件或目录方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

WebPack忽略指定文件或目录

前端Vue项目使用 WebPack 打包时,有时候我们需要忽略掉一些文件。比如一些说明文档、ReadMe之类的,我们只希望它存在于源码中,而不是被打包给用户。

通过修改 webpack.base.conf.js 配置文件,有以下方式可以达到目的。

方法1:使用 null-loader

module: {
    rules: [
      ...
      // 忽略掉所有 .md 文件
      {
        test: /\.md$/,
        loader: 'null-loader',
      },
      ...
    ]
}

由于官方已经不推芥使用此方法,故会显示一个警告:

  WARNING in ./src ^\.\/.*$
  Module not found: Error: Can't resolve 'null-loader' in 'D:\Documents\Projects\Web\xxx'
   @ ./src ^\.\/.*$
  ...

方法2:使用 url-loader

使用 url-loader ,通过在 generator 中返回一个空字符串,达到同样的效果,不会显示警告。

module: {
    rules: [
      ...
      // 忽略掉所有 .md 文件
      {
        test: /\.md$/,
        loader: 'url-loader',
        options: {
          limit: 10,
          generator: (content, mimetype, encoding, resourcePath) => {
            return ''
          }
        },
      },
      ...
    ]
}

WebPack打包忽略某个文件

在这里插入图片描述

在项目中public中新建config.js

在这里插入图片描述

vue.config.js 中设置忽略文件

在这里插入图片描述

引入

在这里插入图片描述

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • vue使用$attrs和$listeners多级组件嵌套传递数据

    vue使用$attrs和$listeners多级组件嵌套传递数据

    这篇文章主要为大家介绍了vue使用$attrs和$listeners多级组件嵌套传递数据示例解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-08-08
  • vite插件打包更顺畅使用技巧示例

    vite插件打包更顺畅使用技巧示例

    这篇文章主要为大家介绍了vite插件打包更顺畅的使用技巧示例,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-06-06
  • vue2.0 实现导航守卫的具体用法(路由守卫)

    vue2.0 实现导航守卫的具体用法(路由守卫)

    这篇文章主要介绍了vue2.0 实现导航守卫的具体用法(路由守卫),vue-route 提供的 beforeRouteUpdate 可以方便地实现导航守卫(navigation-guards),具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-05-05
  • 使用vue控制元素显示隐藏方式

    使用vue控制元素显示隐藏方式

    这篇文章主要介绍了使用vue控制元素显示隐藏方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-08-08
  • vue中对虚拟dom的理解知识点总结

    vue中对虚拟dom的理解知识点总结

    在本篇文章里小编给大家整理了一篇关于vue中对虚拟dom的理解知识点总结内容,有兴趣的朋友们可以学习参考下。
    2021-06-06
  • vue实现编辑器键盘抬起时内容跟随光标距顶位置向上滚动效果

    vue实现编辑器键盘抬起时内容跟随光标距顶位置向上滚动效果

    这篇文章主要介绍了vue实现编辑器键盘抬起时内容跟随光标距顶位置向上滚动效果,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-05-05
  • Vue计算属性与监视属性实现方法详解

    Vue计算属性与监视属性实现方法详解

    最近在学习vue,学习中遇到了一些感觉挺重要的知识点,感觉有必要整理下来,这篇文章主要给大家介绍了关于Vue.js中计算属性、监视属性的相关资料,需要的朋友可以参考下
    2022-08-08
  • vue中使用echarts的示例

    vue中使用echarts的示例

    这篇文章主要介绍了vue中使用echarts的步骤,帮助大家更好的理解和使用vue框架,感兴趣的朋友可以了解下
    2021-01-01
  • Vue3实现下拉选择框多选功能的方法详解

    Vue3实现下拉选择框多选功能的方法详解

    在vue的实际开发过程中,我们如何将以选中的值直接渲染到页面中,下面这篇文章主要给大家介绍了关于Vue3实现下拉选择框多选功能的相关资料,需要的朋友可以参考下
    2023-09-09
  • 脚手架vue-cli工程webpack的基本用法详解

    脚手架vue-cli工程webpack的基本用法详解

    这篇文章主要介绍了vue-cli工程webpack的基本用法,非常不错,具有一定的参考借鉴价值 ,需要的朋友可以参考下
    2018-09-09

最新评论