1.npm安装webpack的插件copy-webpack-plugin(有的在初始化项目可能有安装,可以先在package.json上查看是有copy-webpack-plugin有版本信息。)
命令cnpm install --save-dev copy-webpack-plugin
2.在在项目下新建一个文件夹用于存储不想被编译的文件,如‘static_beta’。
3. 修改webpack配置文件(打开build文件夹下的webpack.prod.conf.js文件)
//头部引入(有安装的,可能已经引入过了)
const CopyWebpackPlugin = require('copy-webpack-plugin');
// 在plugins配置数组中添加一项
plugins: [
new CopyWebpackPlugin([
{
from: path.resolve(__dirname, './static_beta'),
to: 'static',
ignore: ['.*']
}
])
]
//from是指不打包的文件夹的相对路径。 to指向最后放置的文件夹路径
4.注意事项
static目录下的文件不可通过require或者import的方式引入文件,否则该文件就会参与打包。可以通过http请求静态资源的方式,如下例:
import axios from 'axios'
axios.get('static/data.json').then(res => {
if (res.status === 200) {
this.list = res.data
}
})