做一个VUE项目(一 环境安装)

最新推荐文章于 2023-02-07 15:35:28 发布
最新推荐文章于 2023-02-07 15:35:28 发布
阅读量160 收藏
点赞数 1
分类专栏： vue 前端 文章标签： node.js vue.js javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_38327141/article/details/120819005
版权
前端 同时被 2 个专栏收录
17 篇文章 0 订阅
订阅专栏
vue
7 篇文章 0 订阅
订阅专栏

VUE-CLI环境安装

安装node.js环境

安装node

下载node.js window环境安装
下载链接
我下的16.11,作项目开发的小伙伴可以下稳定版
1, 安装
在这里插入图片描述
在这里插入图片描述
2. 修改安装路径
在这里插入图片描述
在这里插入图片描述
3. 安装
在这里插入图片描述
在这里插入图片描述
4. 安装成功
在这里插入图片描述

校验node

安装完成后一定要检验是否安装成功
node安装完成后会连带 npm一起安装,接下来就是校验是否安装成功

  1. 校验node版本
node -v

在这里插入图片描述
出现这个安装成功
2. 校验npm

npm -v

在这里插入图片描述
3. 设置镜像仓库

npm config set registry https://registry.npm.taobao.org

安装VUE环境

安装taobao镜像 vue

注意:一定要安装到全局
npm自带源安装太慢,用taobao的

npm install -g @vue/cli

在这里插入图片描述

出现下面则意味着安装完成

测试vue

vue -V

在这里插入图片描述
如果出现上述错误,用管理员打开powershell 运行下面命令,随后输入A即可

A

set-executionpolicy remotesigned

在这里插入图片描述
随后再次测试
在这里插入图片描述

环境安装完毕,接下来去pycharm生成一个vue项目

pycharm生成vue项目

安装vue插件

在插件中搜索vue 点击安装就好,我的pycharm已经汉化,按照位置参考一样安装
在这里插入图片描述
安装完成后重启pycharm创建项目

创建vue项目

  1. 点击新建项目
  2. 选择vue.js,点开更多,查看是否正确选择node在这里插入图片描述
  3. 修改项目名,创建项目
    在这里插入图片描述
  4. 等待pycharm安装完成
    在这里插入图片描述
    在这里插入图片描述

5.安装完成,启动测试
安装完成后,pycharm会自动配置启动项
在这里插入图片描述
在这里插入图片描述
到这里就结束了,环境配置完毕,明天开始写代码,模仿一个牙科医院页面

辉煌仪奇
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
vscode新建一个最简单的vue项目
09-27
打开命令行工具，进入刚刚创建的`vue-test`目录，然后运行以下命令来初始化一个新的Vue项目： ```bash vue create vue-test ``` 这将启动Vue CLI（命令行界面），引导你选择项目配置。对于初学者，你可以选择...
Vue项目开发需要准备和配置些什么环境？
weixin_52012977的博客
12-15 1531
Node环境 下载：https://nodejs.org/en/，安装在G盘 npm包管理工具（package manager）自动安装完成 安装cnpm npm连接国外的资源，如果超时失败，可安装npm的替代品cnpm，并指定使用淘宝镜像从国内下载资源 命令：npm install -g cnpm --registry=https://registry.npm.taobao.org 安装webpack, webpack-dev-server, webpack-cli 用于打包发布Vue程序。可使用np
如何运行一个Vue项目
01-20
现在，假设你已经从GitHub或其他来源获取了一个Vue项目，你需要做的第一步是进入项目根目录。在命令行中，使用`cd`命令切换到项目所在的文件夹。然后，运行`npm install`来安装项目中列出的所有依赖包。这个过程可能...
vscode 搭建一个vue项目.doc
08-07
本资源将指导您如何在 VSCode 中搭建一个 Vue 项目，从安装依赖项到项目的创建和发布。 一、安装依赖项 1. 安装 Node.js：Node.js 是一个 JavaScript 运行环境，需要在本地安装。 2. 安装 Vue CLI：Vue CLI 是一个...
搭建vue项目环境以及创建一个简单的vue的demo
01-08
2.创建一个项目存放的文件夹目录，然后进入到该目录下 按Shift+鼠标右键点击在此打开PowerShell窗口，此时可使用node -v检查node的版本，如果出现版本号则node已安装，如下图： 3.使用以下命令全局安装vue-cli ...
Vue项目环境搭建详细总结
10-16
Vue项目环境搭建是一个关键步骤，对于前端开发者来说，掌握这一过程是非常重要的。本文将详细介绍如何在Windows环境下搭建Vue项目的开发环境，包括安装Node.js、npm、Vue CLI等工具，并指导如何创建一个Vue项目。 ...
360浏览器 http打开摄像头+麦克风
qq_38327141的博客
08-19 4681
360 谷歌通用 http打开摄像头方式 项目需要，必须用http配合插件，浏览器也必须用360，但是360http协议下面禁止打开摄像头， 于是跑去问答提问吗，不是我黑CSDN问答，千万千万不要去充值有问必答，那些专家回答的都是些什么玩意儿，答非所问吗， 最后还是我自己找到方法实现功能 此方法谷歌，360，或者webkit浏览器通用 360http打开摄像头+麦克风 首先将360浏览器内核设置为webkit内核，设置步骤为复制项目网址，点开设置，高级设置，内核设置，然后设置就行了 1.打开360浏览
大华摄像头网页端控制+web串口(适用任何浏览器,不能用来打我)通讯合集
qq_38327141的博客
08-03 4282
大华摄像头网页端控制+web串口(适用任何浏览器,不能用来打我)通讯合集 web界面操作图 实现原理 通过本地java web服务器开通websocket对服务进行支持,后调用大华java 通用 SDK实现对大华摄像头的控制,已实现网页上按钮全部功能,websocket视频流转发还在制作中,顺利的话后面还会开帖子继续写, 库说明 大华SDK下载路径 官网:传送门 CSDN:传送门 RXTXcommjar下载路径 官网:传送门 CSDN(“此地址版本未知,如需串口,请下载后面打包文件”):传送门 项
VUE 年份范围选择器
qq_38327141的博客
02-07 2934
在使用elment UI的时候发现没有这种功能,于是采用el-date-picker 的年份选择器自己后封装了一个年份范围选择器。由于组件使用的地方很多,所以格式化都在组件中处理,回传格式在回传的 input 事件参数中自己修改。遇到一个需求,需要写一个年份选择器,是范围的年份选择器,比如:xxx年到xxx年。
vue 使用百度地图+自定义消息窗口样式
qq_38327141的博客
05-12 2576
vue 使用百度地图+自定义消息窗口样式前言安装百度地图导入百度地图包百度地图组件封装准备百度地图组件函数封装百度地图页面加载完成后执行函数百度地图信息窗口样式自定义完整组件代码附上效果图 前言 好久没有提笔，这几天又遇到困难了,昨天vue的百度地图插件差点没把我弄死,现在问题得以解决,记录一下 另外提及一下,在写这个帖子时我才接触vue一周,本帖仅记录学习过程与分享结果,本人水平垃圾,不喜勿喷 安装百度地图 安装百度地图vue包 npm install vue-baidu-map 导入百度地图包
后端 乐橙云开放平台获取管理员token测试demo
qq_38327141的博客
12-21 1577
乐橙云开放平台获取管理员token测试demo前端页面文档django配置测试代码 前端页面文档 html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>测试demo</title> <script src="test.js"></script> <script src="jquer
Django+channels使用WebSocket报错解决方案
qq_38327141的博客
07-20 1541
Django+channels使用WebSocket报错解决方案开发环境WebSocket ASGI 配置代码routingchatusers.routingChatServicedjango 启动报错代码浏览器django 报错界面报错原因ChatService 修改成功截图Django端浏览器端 开发环境 channels==3.0.4 Django==3.2 django-werkzeug-debugger-runserver==0.3.1 django-extensions==3.1.3 WebS
vue build+部署
qq_38327141的博客
09-26 1376
生产文件建立 pycharm build 创建npm build配置 运行成功后得到文件 CMD npm 命令 build 打开cmd 进入项目vue项目根目录 输入下面命令 npm run build build成功后得带文件 将项目更目录下的dist打包发送到服务器 web 部署 解压web服务 将web服务文件解压到指定目录下 解压完成后如下图所示,进入web服务主目录复制路径 安装nginx代理 下载nginx nginx版本 1.18.0 安装链接nginx 1.18.0
table分页组件
qq_38327141的博客
12-07 1170
table分页组件前言代码部分html代码效果图shujv2.js说明替换使用后测试图用于项目 前言 最近在做个一项目,前后端一起做,需要做一个查询分页的功能,于是想要找一个合适好用的js table分页组件,结果发现各种网页上面不是不好用,就是不能够使用,也可能是我级别太低用不了好多例子都没有结果.今天在一个网站上面找到了一个很好用的组件,现在分享给大家.链接在这里>>> 代码部分 话不多说,直接上代码 html代码 <!DOCTYPE html> <html&gt
uve 使用百度ueditor自定义图片上传,在线图片插入,在线图片管理
qq_38327141的博客
05-22 1077
uve 使用百度ueditor自定义图片上传,在线图片插入,在线图片管理==前言==环境自定义组件1.上传1.1代码1.2组件调用说明2.百度ueditor2.1 代码2.2组件调用说明参考,引用组件==**2.本帖所有内容均属于原创,转载请注明出处**==对本帖有疑问,使用过程中出现问题,可以私信我或加我微信,备注:ueditor 前言 本帖所有内容均用于学习使用,如有涉及侵权,请看到后联系我进行删帖 环境 “axios”: “^0.21.1”, “element-ui”: “^2.4.5”, “l
python 打包文件转安装包-使用NSIS制作windows安装包
qq_38327141的博客
01-12 1028
exe通过NSIS打包成安装包
nginx代理静态文件文件加载出错修复方案
qq_38327141的博客
03-04 984
nginx代理静态文件文件加载出错 :Resource interpreted as Stylesheet but transferred with MIME type application/octet-stream: "http://192.168.174.135/static/css/login.css".nginx代理静态文件文件加载出错修复方案故障原因百度查询按照各个帖子方法中和后 Resource interpreted as Stylesheet but transferred with MI
做一个VUE项目(三 vue--项目结构梳理)
qq_38327141的博客
10-25 799
vue项目初始化 vue pychatm创建项目 点击这里查看 pycharm创建的初始vue项目会有一个hello word界面,运行后如下所示 文件结构如下 1. 删除App.vue中不属于我们需要的部分 删除后的App.vue <template> <div id="app"></div> </template> <script> export default { name: 'App', components: {
tinymce使用
qq_38327141的博客
02-02 641
tinymce5.6.2使用下载tinymce引入tinymce初始化tinymce预览界面 下载tinymce 请戳这里下载最新版免费版tinymce 注： tinymce有版权，我我是用的是官方社区版及开发版 引入tinymce 将下载好的tinymce社区开发板解压后放入我们的项目静态文件里面，在项目中引入tinymce即可，如下图： <script src="/static/tinymce/tinymce.min.js"></script> 初始化tinymce
vue 搭建一个项目配置环境
最新发布
09-11
要搭建一个 Vue 项目的开发环境，你需要进行以下步骤： 1. 安装 Node.js：首先，你需要在你的计算机上安装 Node.js，它是运行 JavaScript 的运行时环境。你可以去 Node.js 的官方网站下载适合你操作系统的安装包，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

辉煌仪奇

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值