Vue零基础入门记录
在2020年这个开局不利的年份毕业,实习工作都很难得。最近来到一家单位,为了减小开支实习生过来了的话前端后端都要写。用Vue和ElementUI做界面。以前的前端vue了解还停留在new一个Vue实例然后和后台建立联系的水平,没真正写过前端界面。看到js后缀的文件很头疼。看了一整天感觉好多了。整理一下昨天看的内容。
第一步:
在下载安装完nodejs之后,在node的主文件夹下建立两个文件夹:node_global和node_catch,这俩一个是用于存储nodejs的全局模块,另一个我还不太清楚,应该后面会用到的吧。
需要修改两次环境变量中的路径,一个是在Path中添加:
C:\Program Files\nodejs\node_global
无论是系统的Path还是用户的Path都可以,然后再在系统环境变量列表中个,新建一个叫做NODE_PATH的环境变量,内容是:
C:\Program Files\nodejs\node_global\node_modules
第二步:
大致的环境差不多了就开始安装vue和Vue-Cli脚手架工程。因为我主要还是想做后端开发,所以用脚手架搭建项目简单一点,里面的细节我还很不了解。。
//在cmd窗口输入这两行命令,完成之后差不多就完成了安装
npm install vue -g
npm install vue-cli -g
第三步:
完成上面的操作,所有的配置应该都OK了,我们可以迅速使用Vue-Cli建立一个小的网页,我想要/VueJS/下建立我的应用,就可以使用CMD这个目录下,然后输入命令:
//这里的Front是项目名,可以取其他名
vue init webpack Front
第四步;
脚手架会自动创建标准的vue项目,后面会让写一些选项

完成后进入项目路径,我这里是Front目录
然后输入指令
npm install
这行代码会安装其他node.js的包
第四步:
在Front项目目录输入运行项目的指令
npm run dev
项目成功运行后就会自动跳出默认主页

Vue零基础入门记录的更多相关文章
- 接上一篇:vue零基础入门记录
上一篇的vue项目已经搭建运行了起来,我用惯了idea这里也用的idea打开的项目.貌似其他软件写前端更好. 打开项目的项目路径是这样的 写惯了后台,第一眼看的时候感觉这个项目路径很乱,后面才知道我们 ...
- 从零基础入门JavaScript(1)
从零基础入门JavaScript(1) 1.1 Javascript的简史 1995年的时候 由网景公司开发的,当时的名字叫livescript 为了推广自己的livescript,搭了j ...
- Cloudera Manager、CDH零基础入门、线路指导 http://www.aboutyun.com/thread-9219-1-1.html (出处: about云开发)
Cloudera Manager.CDH零基础入门.线路指导http://www.aboutyun.com/thread-9219-1-1.html(出处: about云开发) 问题导读:1.什么是c ...
- 【JAVA零基础入门系列】Day12 Java类的简单应用
俗话说的好,实践出真知,所以除了理论知识掌握扎实以外,更重要的是要多加操练,这样才能掌握核心科技. 今天我们就用刚学会的类来实践一下,目标便是完成上一篇中的剁手任务. 我们的商品类已经准备好了,代码重 ...
- 【JAVA零基础入门系列】Day14 Java对象的克隆
今天要介绍一个概念,对象的克隆.本篇有一定难度,请先做好心理准备.看不懂的话可以多看两遍,还是不懂的话,可以在下方留言,我会看情况进行修改和补充. 克隆,自然就是将对象重新复制一份,那为什么要用克隆呢 ...
- 零基础入门微信小程序开发
注:本文来源于:<零基础入门微信小程序开发> 课程介绍 本达人课是一个系列入门教程,目标是从 0 开始带领读者上手实战,课程以微信小程序的核心概念作为主线,介绍配置文件.页面样式文件.Ja ...
- Linux及Arm-Linux程序开发笔记(零基础入门篇)
Linux及Arm-Linux程序开发笔记(零基础入门篇) 作者:一点一滴的Beer http://beer.cnblogs.com/ 本文地址:http://www.cnblogs.com/bee ...
- .NET零基础入门09:SQL必知必会
一:前言 仿佛到了更进一步的时候了,每一个程序员迟早都会遇到数据存储的问题.我们拿什么来存储程序产生的数据?举例来说,用什么来存储我们的打老鼠游戏每次的成绩呢?选择如下: 1:内存中.缺点,退出游戏, ...
- 零基础入门 实战mpvue2.0多端小程序框架
第1章 课程快速预览(必看!!!)在这一章节中,老师讲带领你快速预览课程整体.其中,涉及到为什么要做这么一门实战课程.制作一个小程序的完整流程是怎么样的,以及如何做项目的技术选型. 第2章 30 分钟 ...
随机推荐
- [Qt] 文本文件读写, 摘自官方文档
Reading Files Directly The following example reads a text file line by line: QFile file("in.txt ...
- 企业级 Harbor 镜像仓库
Harbor是由VMWare公司开源的容器镜像仓库.事实上,Harbor是在Docker Registry上进行了相应 的企业级扩展,从而获得了更加广泛的应用,这些新的企业级特性包括:管理用户界面,基 ...
- dotnetcore配置框架简介
一.前言 配置的本质就是字符串的键值对,微软的一系列接口其实就是对这些键值对字符串的抽象. 二.基本类型 2.1.Nuget包 Microsoft.Extensions.Configuration.A ...
- 14.在Python中lambda函数是什么
在Python中lambda函数是什么? It is a single expression anoymous function often used as inline function. lamb ...
- Shiro(三):Spring-boot如何集成Shiro(下)
上一篇文章介绍了shiro在spring-boot中通过filter实现authentication流程(通过设置filterMaps也可以达到authorization的目的):这篇文章主要介绍sp ...
- uboot on qemu
1, download uboot ftp://ftp.denx.de/pub/u-boot/ 2, compile uboot make vexpress_ca9x4_config export A ...
- Vue.js中scoped引发的CSS作用域探讨
前言 在Vue.js的组件化开发中,常常会对某个组件的style标签加上scoped属性,如<style lang='less' scoped>,这样做的目的在于使这个组件的样式不能轻易在 ...
- Spring源码学习01:IntelliJ IDEA2019.3编译Spring5.3.x源码
目录 Spring源码学习01:IntelliJ IDEA2019.3编译Spring5.3.x源码 前言 工欲善其事必先利其器.学习和深读Spring源码一个重要的前提:编译源码到我们的本地环境.这 ...
- Jenkins+Ansible+Gitlab自动发布/回滚Spring项目
一.实现方法流程图 流程图如下:代码托管在本地GitLab上(为了复现整套流水线,我直接使用了GitHub,懒得再搭建GitLab),开发完成后提交代码到代码仓库,[自动]触发Jenkins进行持续集 ...
- JWT安全问题
Json Web Tokens 在线工具网站:https://jwt.io/ python 用到的库 jwt // pip install pyjwt JWTCrack key // git c ...