vue 打包怎么把public打包过去
时间: 2024-08-06 10:01:00 浏览: 70
Vue.js打包通常涉及到构建工具如Webpack和Vue CLI,其中包含了一个名为`publicPath`的配置选项,用于设置静态资源(如图片、CSS和JavaScript文件)的URL前缀。当你运行`npm run build`或`vue-cli-service build`命令时,Webpack会将所有位于`src/public`目录下的内容复制到生成的dist文件夹的对应位置。
以下是基本步骤:
1. **Vue.config.js** 或者 `.env` 配置文件中:
- 如果使用的是Vue CLI 3.x及以上版本,可以在`.vue-cli-service.config.js`中设置`publicPath`:
```javascript
module.exports = {
//...
chainWebpack(config) {
config.output.publicPath = './';
},
};
```
- 如果使用`.env`环境变量:
```
PUBLIC_PATH=/
```
2. **src** 目录结构:
- 将`public`文件夹下的资源放在`src`根目录下,例如`src/images`, `src/css`, 等。
3. **打包时处理**:
- 当运行构建脚本时,Webpack会自动复制`public`文件夹的内容到构建后的`dist`目录下,并按照`publicPath`设置的路径进行部署。
如果你有自定义的需求,比如需要上传到CDN,那么还需要配合相应的配置,比如利用Webpack的CopyWebpackPlugin插件或手动操作。
阅读全文