在vue上安装和使用elementui教程(附碰到的诸多问题的解决方案)
首先我是按照这个教程https://segmentfault.com/a/1190000019647625安装了elementui,然后在下载和使用的时候出现了问题。
后续问题的解决方案可以依次参考:
- https://blog.csdn.net/u014054437/article/details/79862793
- https://blog.csdn.net/weixin_42512937/article/details/103475319
- https://www.jianshu.com/p/32a5edadc29d
第1个和第2个链接方法好像是类似的,可以试完第1个链接的方法之后如果有用就不用试第2个了,第3个链接最好还是看一下。
我在解决问题的过程中还看到了这个教程https://blog.csdn.net/weixin_41662207/article/details/90258577,然后我就把我的两个scrip改为了一个,发现还是报错,之后我还是改回了两个,发现是可以的。
另外说明一下,根据elementui的中文文档代码:
<script src="//unpkg.com/vue/dist/vue.js"></script>
<script src="//unpkg.com/element-ui@2.13.2/lib/index.js"></script>
<div id="app">
<el-row>
<el-button>默认按钮</el-button>
<el-button type="primary">主要按钮</el-button>
<el-button type="success">成功按钮</el-button>
<el-button type="info">信息按钮</el-button>
<el-button type="warning">警告按钮</el-button>
<el-button type="danger">危险按钮</el-button>
</el-row>
</div>
这里的script是在线引用,而我是需要离线引用,所以需要改一下script的描述,我的script代码如下:
<script src="element-ui/lib/index.js">
</script>
<script>
export default {
name : "app",
}
</script>
全文代码:
<template>
<div id= "app">
<el-row>
<el-button>默认按钮</el-button>
<el-button type="primary">主要按钮</el-button>
<el-button type="success">成功按钮</el-button>
<el-button type="info">信息按钮</el-button>
<el-button type="warning">警告按钮</el-button>
<el-button type="danger">危险按钮</el-button>
</el-row>
</div>
</template>
<script src="element-ui/lib/index.js">
</script>
<script>
export default {
name : "app",
}
</script>
然后就能正常运行使用了(npm run dev)。