美文网首页
vue使用cdn引入vue和element-ui

vue使用cdn引入vue和element-ui

作者: 摇裤儿 | 来源:发表于2020-05-28 17:41 被阅读0次

    #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
    });
    

    相关文章

      网友评论

          本文标题:vue使用cdn引入vue和element-ui

          本文链接:https://www.haomeiwen.com/subject/nqwaahtx.html