#vue使用cdn引入vue和element-ui
// 1、在index.html文件写入
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>vue-cdn</title>
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
</head>
<body>
<script src="https://cdn.bootcss.com/vue/2.6.10/vue.min.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
// 2、 在main.js注释导入的vue和element包
// 3、webpack.base.conf.js -> 加上代码
module.exports = {
context: path.resolve(__dirname, "../"),
entry: {
// app: "./src/main.js"
app: ["babel-polyfill", "./src/main.js"]
},
// 外部引入资源配置
externals: {
vue: "Vue",
"element-ui": "ELEMENT" // element-ui:包名,ELEMENT:全局需要使用的变量名
},
}
# element-ui 关于使用cdn引入方式报错 ReferenceError: Message is not defined
解决方案:
// ELEMENT 全局配置的变量名
ELEMENT.Message({
message: res.data.msg,
type: "error",
duration: 5000
});