0


新手入门Vue,在VScode中使用Vue的两种办法

根据vue官方文档,官方提供了两种方式来使用vue框架。

创建一个html文件,然后在其中通过如下两种方式引入 Vue:

  1. <!-- 开发环境版本,包含了有帮助的命令行警告 -->
  2. <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>

可以简单理解为完整版本,适合初学者使用。

  1. <!-- 生产环境版本,优化了尺寸和速度 -->
  2. <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>

可以简单理解为mini版本,部分代码被压缩,速度更快。

以上方式二选一后,接下来:

在HTML中引入如下代码

  1. <div id="app">
  2. {{ message }}
  3. </div>

在js中引入如下代码

  1. var app = new Vue({
  2. el: '#app',
  3. data: {
  4. message: 'Hello Vue!'
  5. }
  6. })

完成以上操作后,开始使用vue的基本操作就完成了。

最终效果图如下:


本文转载自: https://blog.csdn.net/weixin_51472145/article/details/123270971
版权归原作者 Bule Guy 所有, 如有侵权,请联系我们删除。

“新手入门Vue,在VScode中使用Vue的两种办法”的评论:

还没有评论