vue中cdn引入element-ui 如何在其他js中引入element-ui

vue-cli

index.html中采用 cdn 引入 element

<link rel="stylesheet" href="https://unpkg.com/element-ui@2.3.7/lib/theme-chalk/index.css">
<script src="https://cdn.bootcss.com/vue/2.5.2/vue.min.js"></script>
<script src="https://cdn.bootcss.com/vue-router/3.0.1/vue-router.min.js"></script>
<script src="https://cdn.bootcss.com/axios/0.18.0/axios.min.js"></script>
<script src="https://cdn.bootcss.com/vue-i18n/7.6.0/vue-i18n.min.js"></script>
<script src="https://unpkg.com/element-ui@2.3.7/lib/index.js"></script>

webpack.base.conf.js 中代码如下

externals: {
    'vue': 'Vue',
    'vue-router': 'VueRouter',
    'axios': 'axios',
    'element-ui': 'element-ui',
    'i18n': 'i18n',
},

现在想在自己写的js中使用element组件该怎么引用

import {Message} from 'element-ui'
Message(123);

这样用Message会报external "element-ui"?c60b:1 Uncaught ReferenceError: element is not defined错误

谢谢

回答:

cdn 版本的 element-ui 设置的全局变量是 ELEMENT

externals: {
  'element-ui': 'ELEMENT',
}

回答:

修改配置后还是提示Element未定义,是因为Element依赖Vue,vue.js需要在element-ui之前引入,所以vue.js也要改为cnd的引入方式

回答:

请问大佬解决了吗

回答:

您好,为什么这样改完之后还是会报错呢?

ELEMENT is not defined

回答:

使用cdn引入vue 和 element-ui 后,main.js中应该是什么样?

回答:

webpack.base.conf.js

externals:{

'vue': 'Vue',
'vue-router': 'VueRouter',
'axios':'axios',
'element-ui': 'ELEMENT'

},

//你要用的js
ELEMENT.Message({

showClose: true,
message: response.data.msg,
type: "error"

});

回答:

 externals: {
    vue: 'Vue',
    'element': 'element-ui'
  },

回答:

请问一下,在externals中定义的都会报undefined,是需要在webpack.base.conf.js引入定义的那些吗?

回答:

externals: {
    'vue': 'Vue',
    'vue-router': 'VueRouter',
    'vuex': 'Vuex',
    'element-ui': 'ELEMENT',
   },

暂无评论

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注