vue.config.js配置cdn加速
时间: 2023-10-28 09:18:42 浏览: 42
在 Vue.js 项目中使用 CDN 加速可以提高网站的访问速度,可以通过以下步骤来配置:
1. 在 `public/index.html` 文件中引入 CDN 资源:
```html
<!DOCTYPE html>
<html>
<head>
<!-- 省略其他内容 -->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="https://cdn.jsdelivr.net/npm/vue-router"></script>
<script src="https://cdn.jsdelivr.net/npm/vuex"></script>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
```
2. 在 `vue.config.js` 文件中配置:
```js
module.exports = {
// 省略其他配置
configureWebpack: {
externals: {
'vue': 'Vue',
'vue-router': 'VueRouter',
'vuex': 'Vuex'
}
}
}
```
上述代码中,`externals` 配置项用于告诉 webpack 不要打包这些模块,而是使用全局变量中的这些模块。这里我们将 `vue`、`vue-router` 和 `vuex` 模块都配置成了全局变量。
注意:如果你的 CDN 资源版本与项目依赖的版本不一致,可能会导致一些问题,建议保持一致。