运用webpack复制静态文件

1. 运用yarn或npm添加相应的依赖包

在命令行中输入

    npm install copy-webpack-plugin --save-dev

    yarn add copy-webpack-plugin -D

2. 在webpack.config.js 中引入依赖,根据实际项目路径并进行配置


 

3. 然后通过webpack进行打包

在命令行中输入(webpack4.x版本)

    webpack --mode production

可以发现,静态文件以及进行成功转移。
 
注:常见错误
 
  文件夹的相对路径比较容易写错,构建就会报如下错误

    Error in [copy-webpack-plugin] unable to local "**" at "**"

  使用Node.js中的全局变量__dirname+文件夹路径即可(例:“/src/assets”)

原文地址:http://blog.51cto.com/13677514/2092140

时间: 2024-11-05 20:24:44

运用webpack复制静态文件的相关文章

create-react-app 打包后静态文件过大 webpack优化

在最近的项目里,页面和静态文件并不是很多的情况下,打包后发现产出的静态资源却很大. 1.关掉sourcemap 在config/webpack.config.js文件里,大概30几行的位置添加这样一句代码,这样做的作用是防止线上生成环境将源码一起打包部署. 2.将一些公共的库(比如antd)做一个缓存 splitChunks: { chunks: 'all', name: "vender", cacheGroups: { vender: { name: "vendor&quo

express整合webpack的打包文件dist

对于我来说,第一次接触前后端整合问题的小白,刚开始是一脸懵逼,这个问题整整坑了我一个晚上加一个早上,现在写出来总结: 前端开发:vue-cli+webpack: 后台开发:nodejs框架express: 前端开发之后,使用localhost能正确访问vue-cli自带的服务器. 而在后台方面,一开始我是直接在expres的views和public上开发前端页面,因此在一些配置方面都是上个项目的,现在整合新项目,让我有点方. 过程: 1.进入前端目录,npm run build 命令直接将前端项

Discuz!NT静态文件缓存(SQUID)

在目前最新版本的产品中,我们提供了缓存静态文件的解决方案,就是使用SQUID做静态前端,将论坛中的大部分静态文件布署或外链到一个新的HTTP链接上,其中可以外链的静态文件包括: 1.Discuz.web/Javascript/ 下所有以‘template_’打头的JS文件以及该文件夹下的部分js文件.     2.模版文件夹下的所有CSS或IMAGE文件(空间相册文件夹除外)     3.前台Image文件夹下的Medal(勋章),Topicidentify(主题鉴定图标)下的所有文件. 同时在

Djanto static静态文件配置

django的settings中包含三个static相关设置项: STATIC_ROOT STATIC_URL STATICFILES_DIRS STATIC_URL 好理解,就是映射到静态文件的url,一般为/static/ STATICFILES_DIRS 是个列表,放各个app的static目录及公共的static目录 STATIC_ROOT 是总的static目录,可以使用命令自动收集static文件 假设有个工程djangodemo,有两个app为demo1跟demo2 django处

NET Core 静态文件及JS包管理器(npm, Bower)的使用

NET Core 静态文件及JS包管理器(npm, Bower)的使用 文章目录 在 ASP.NET Core 中添加静态文件 使用npm管理JavaScript包 使用Bower管理JavaScript包 在 ASP.NET Core 中添加静态文件 虽然ASP.NET主要大都做着后端的事情,但前端的一些静态文件也是很重要的.在ASP.NET Core中要启用静态文件,需要Microsoft.AspNetCore.StaticFiles组件.可以通过Nuget添加,或者在project.jso

记一次vue2项目部署nginx静态文件404解决过程

github上下的一个vue2的项目,运行可以的,webpack打包后,nginx请求报错: 发现路径很奇怪啊,所以果断来到build.js文件中看看是不是哪里不对. 已经一番引用查找: 发现在这里配置了个属性值.assetsPublicPath这个名字看着就是静态文件的公共位置嘛,所以直接请求了这个地址下的css/js文件. 于是我到这个路径下找找看看,是不是有css/js文件: 发现打包文件很规范根本没有这些个东西.所以自然而然,我要把assetsPublicPath这个属性的值改为根目录试

symfony静态文件解决方案(未完待续)

目前,在symfony中与静态资源有关的目录有三个:/app /src /web app     -- Resources         -- assets             -- css             -- js             --scss src     -- AppBundle     -- CodeExplorerBundle         -- Resources             -- config             -- views    

KVM——复制xml文件与磁盘文件复制克隆虚拟机

kvm虚拟机克隆有如下两种方式: 1.KVM本机虚拟机直接克隆 2.通过复制xml文件与磁盘文件复制克隆 (适用于异机的静态迁移和状态保存便于以后使用). 本次主要介绍如何复制xml文件与磁盘文件复制克隆虚拟机: 简易版原理图: A(模板)            B(克隆) disk                disk xml                 xml 需要更改内容          会变的内容 udev-mac            uuid yum             

静态文件配置

STATIC_URL静态文件url STATIC_ROOT 静态文件根路径,开发环境才用,收集所有静态文件,不能和STATICFILES_DIRS  重合 STATICFILES_DIRS  每个app的静态文件路径,引用static文件还是用{{static}}的方式, 它会依次向下查询static,所以写static的方式,先写共用的static,再是分别每个app下面的static   django的settings中包含三个static相关设置项: STATIC_ROOT STATIC_