如何在Nuxt项目中保留.htaccess文件？解决nuxt generate后文件丢失问题

下面是几种可靠的解决方式：

方法1：利用Nuxt的static目录（最简单） #

Nuxt的static目录下的所有文件都会被原封不动复制到生成的dist目录根目录，直接把你的.htaccess文件移动到项目根目录的static文件夹里即可。执行nuxt generate后，dist目录里就会自动带上这个文件。

方法2：通过Nuxt钩子自动复制文件 #

如果不想移动原文件，可以在nuxt.config.js里添加生成完成后的钩子，手动复制.htaccess到dist目录：

首先安装fs-extra（比原生fs模块更易用）：

npm install fs-extra --save-dev

然后在nuxt.config.js中添加配置：

const fs = require('fs-extra')

export default {
  hooks: {
    'generate:done': async () => {
      await fs.copy('./.htaccess', './dist/.htaccess')
    }
  }
}

这样每次执行nuxt generate完成后，脚本会自动把根目录的.htaccess复制到dist目录中。

方法3：修改npm脚本，在生成后执行复制命令 #

直接在package.json的scripts里修改generate命令，在生成完成后追加复制操作：

适用于Linux/macOS： #

{
  "scripts": {
    "generate": "nuxt generate && cp .htaccess dist/"
  }
}

适用于Windows： #

{
  "scripts": {
    "generate": "nuxt generate && copy .htaccess dist\\"
  }
}

如果需要跨平台兼容，可安装copyfiles包实现：

npm install copyfiles --save-dev

然后脚本改为：

{
  "scripts": {
    "generate": "nuxt generate && copyfiles -f .htaccess dist/"
  }
}

内容的提问来源于stack exchange，提问作者MH info