vue打包后copy一些静态资源文件到dist,可通过url直接访问

若打包后的dist文件里没有static文件,有些需求会想要访问到项目中的某些静态资源文件,而vue打包并没有把static文件打包进去,这就需要在打包后copy目标文件到dist里面

  1. 找到package.json文件,配置build如下
    "build": "vue-cli-service build && node copy_static.js"
    
  2. 安装copy-dir,这是可以操作文件系统的包
    npm install copy-dir
  3. 在项目的根目录下找到创建一个copy_static.js文件
    在文件里打印一下console.log(111),然后运行一下程序,如果在终端能正确输出,说明文件配置成功啦。我们就可以随便在里面操作了。
  4. 在copy_static文件中写入要复制到打包后的文件,这里是复制static目录到dist里面
    例:
    let copydir = require('copy-dir')
    copydir.sync(process.cwd() + '/static', process.cwd() + '/dist/static', {
      utimes: true,
      mode: true,
      cover: true
    }, function (err) {
      if (err) throw err
      console.log('done')
    })
    
    process.cwd()获取当前路径。完了打包运行一下,我们就能在dist里面看到我们复制过去的文件啦。然后通过url地址 xxx.com/static/xx.js就可以访问到我们的文件啦
Logo

前往低代码交流专区

更多推荐