vue项目中的public、static及指定不编译文件问题

在Vue项目中，public、static以及指定不编译文件是比较重要的概念，下面我将详细讲解这些概念。

public 文件夹

public文件夹是一个特殊的目录，其中的文件会在打包时被直接拷贝到输出目录（dist）下，不经过编译。因此，在public文件夹中添加的文件不会被Vue进行webpack构建的过程处理，最终输出的结果会直接使用这些文件，适用于一些不需要被打包处理的资源。

例如，我们在public文件夹下放置了一个index.html文件，它会在构建的时候被直接拷贝到输出目录中，而不是通过webpack打包构建处理。这样就可以为该页面自定义一些详细的配置，如title、关键字、外部链接CDN等。

static 文件夹

在Vue项目中，如果需要在应用中使用一些静态资源，例如图片、字体、JSON数据等，你可以将这些文件放在static文件夹内。与public文件夹不同的是，这些静态资源在打包构建过程中同样会被拷贝到输出目录（dist）中，但在输出时，会通过webpack进行处理，用于最终的打包资源。

例如，在static文件夹中添加了一个test.png图片，我们在Vue代码中可以通过/static/test.png路径获取到该图片，且该图片在打包成最终结果时会被webpack处理输出。

指定不编译文件

有时候，我们可能希望不对某些文件进行编译，这通常适用于第三方库或者一些自定义的特殊模块文件。在Vue项目中，可以通过vue.config.js文件来指定不编译文件。

例如，我们希望不对lodash.js文件进行编译，则可以在vue.config.js文件中添加如下配置：

module.exports = {
  chainWebpack: config => {
    config.module
      .rule('lodash')
      .test(/lodash\.js$/)
      .use('null-loader')
        .loader('null-loader')
        .end()
  }
}

这个配置的作用是，当webpack匹配到类似lodash.js的文件时，使用null-loader来代替默认的loader，从而达到不编译的目的。

另一个例子是针对第三方库jQuery进行配置，如果我们不想将其打入到最终用于生产的代码中，可以在vue.config.js文件中如下配置：

module.exports = {
  configureWebpack: {
    externals: {
      jquery: 'jQuery'
    }
  }
}

这样，将使得在引入jQuery时自动从全局对象中引入，而不会被打包进最终生产代码中。

以上就是关于Vue项目中public、static以及指定不编译文件的详细讲解。