vue的基础配置

最新推荐文章于 2024-05-21 19:09:41 发布

小熊同学丶

最新推荐文章于 2024-05-21 19:09:41 发布

阅读量94

点赞数

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/qq_46629139/article/details/130598030

版权

先解压我发的链接，文件后续有用
链接：https://pan.baidu.com/s/1heBZK78jIKs93I5vS6DfAw
提取码：6666
在下所有操作都是在Code里面进行前端操作的
首先创建一个空的文件夹
在这里插入图片描述
把文件夹放到Code里面打卡

进来之后是这样的可能你们的版本不同
接下来是基础配置
先创建一个文件夹名字随意，在文件里面创建一个.html文件

在这里插入图片描述
在.html里面输入这些,注意《初识vue》是你创建文件的名字

初识vue

</head>
<body>

</body>
</html>

在这里插入图片描述
然后在下面创建js文件夹实在总文件夹里面不是html文件夹里面
然后是用到解压缩文件了就是03文件夹里面的两个vue.js
把这两个文件放到刚才创建的js文件夹里面
如下图直接拉进来也可以拉不进来就去你创建的文件里面找js文件复制也可以
在这里插入图片描述 然后引入vue

    <script type="text/javascript" src="../js/vue.js"></script>
    <script type="text/javascript">
        Vue.config.productionTip =false//阻止 vue 在启动时生成生产提示
    </script>

在这里插入图片描述
接下来就可运行一下了我用的是（谷歌浏览器）右键点

此时会运行弹出浏览器此时是一个空的因为啥都没写

点击F12找到Console会有以下两个这不是报错可能是一个也可能是两个都会有的

在这里插入图片描述
在下方输入Vue回车他会有是否引入，出现如下就是引入成功。没有的话就去检查一下上面代码是否出错或者空格少了

下面是加载vue的工具我发的压缩包里面有浏览器工具，在05_其他文件夹里面谷歌为例，点击扩展程序在这里插入图片描述打开开发者模式右上角就可以直接把文件拖进来
是哟个这样的
点击固定就可以直接看到了

此时刷新一下应该 F12 啥提示都没有了
ok，开发环境就此搭建完成

小熊同学丶

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
vue的基础配置

在下方输入Vue回车他会有是否引入，出现如下就是引入成功。链接：https://pan.baidu.com/s/1heBZK78jIKs93I5vS6DfAw。点击F12找到Console会有以下两个这不是报错可能是一个也可能是两个都会有的。下面是加载vue的工具我发的压缩包里面有浏览器工具，在05_其他文件夹里面。直接拉进来也可以拉不进来就去你创建的文件里面找js文件复制也可以。先创建一个文件夹名字随意，在文件里面创建一个.html文件。接下来就可运行一下了我用的是（谷歌浏览器）右键点。
复制链接

扫一扫