vue 项目实战 (入门)
环境搭建
安装NodeJS →箭头https://nodejs.org/en/
NPM是随同NodeJS一起安装的包管理工具。
检查环境是否安装成功:
打开一个命令提示符,有成功输出版本号则为安装成功。
//检查node 版本号
node -v
//检查npm版本号
npm -v
安装vue
npm install vue -g
npm install -g @vue/cli
新建项目
vue create vuedemo
选择第一个就是默认配置了babel 跟eslint 一般选择第二个
选择相应的比如说路由啊 vuex 啊 这些基本的配置,键盘上下键移动选择则按空格键选中,确认则回车
安装哪一种 CSS 预处理语言
选择哪个自动化代码格式化检测,因为我是用vscode编辑器的选择了最后一个
询问是否要保存配置,下次新建项目就不需要再次选择了
babel,postcss,eslint这些配置文件放哪
1.放独立文件放置 2.放package.json里
根据我们刚才所选择的配置 就开始安装相关的依赖和包了
运行项目
cd vuedemo
npm run serve
跑起来后浏览器打开
好了,就这样基本上这样你就跑起来一个vue 项目了
此随笔乃本人学习工作记录,如有疑问欢迎在下面评论,转载请标明出处。
如果对您有帮助请动动鼠标右下方给我来个赞,您的支持是我最大的动力。
vue 项目实战 (入门)的更多相关文章
- webpack+vue项目实战(四,前端与后端的数据交互和前端展示数据)
地址:https://segmentfault.com/a/1190000010063757 1.前言 今天要做的,就是在上一篇文章的基础上,进行功能页面的开发.简单点说呢,就是与后端的数据交互和怎么 ...
- vue项目实战, webpack 配置流程记录
vue项目实战记录,地址在这 购物车单界面 npm install npm run dev 跑起来可以看到界面效果 这里简单记录一下webpack的编译流程 入口 package.json " ...
- vue项目实战
本篇文章主要介绍了vue的环境配置,vue项目的目录结构以及在开发vue项目中问题的一些解决方案. 环境配置及目录结构 1.安装node.js(http://www.runoob.com/nodejs ...
- Spring Boot +Vue 项目实战笔记(一):使用 CLI 搭建 Vue.js 项目
前言 从这篇文章开始,就进入真正的实践了. 在前端项目开发中,我们可以根据实际情况不同程度地使用 Vue.利用 Vue CLI(或写成 vue-cli,即 Vue 脚手架)搭建出来的项目,是最能体现 ...
- Vue 项目实战系列 (一)
最近一直在学习Vue,基本的文档看完后就需要进行具体的项目进行练手了,本系列文章主要是将我学习过程记录下来,和大家一起学习交流. 我在git上找到了一个淘票票的Vue项目,项目地址: https:// ...
- vue项目实战总结
马上过年了,最近工作不太忙,再加上本人最近比较懒,毫无斗志,不愿学习新东西,或许是要过年的缘故(感觉像是在找接口). 就把前一段时间做过的vue项目,进行一次完整的总结. 这次算是详细总结,会从项目的 ...
- 详细记录vue项目实战步骤(含vue-cli脚手架)
一.通过vue-cli创建了一个demo. (vue-cli是快速构建这个单页应用的脚手架,本身继承了多种项目模板:webpack(含eslit,unit)和webpack-simple(无eslin ...
- vue项目实战经验汇总
目录 1.vue框架使用注意事项和经验 1.1 解决Vue动态路由参数变化,页面数据不更新 1.2 vue组件里定时器销毁问题 1.3 vue实现按需加载组件的两种方式 1.4 组件之间,父子组件之间 ...
- Asp.NET Core2.0 项目实战入门视频课程_完整版
END OR START? 看到这个标题,你开不开心,激不激动呢? 没错,.net core的入门课程已经完毕了.52ABP.School项目从11月19日,第一章视频的试录制,到今天完整版出炉,离不 ...
随机推荐
- 查看Chrome密码只需一段代码
在Chrome浏览器的地址栏里输入“ chrome://chrome/settings/passwords ”,然后Chrome自动帮你保存的密码就会瞬间被曝露出来. 强调一下,只要不是在本机上输入以 ...
- 通俗易懂--岭回归(L2)、lasso回归(L1)、ElasticNet讲解(算法+案例)
1.L2正则化(岭回归) 1.1问题 想要理解什么是正则化,首先我们先来了解上图的方程式.当训练的特征和数据很少时,往往会造成欠拟合的情况,对应的是左边的坐标:而我们想要达到的目的往往是中间的坐标,适 ...
- Object constructor
1. Object is an instance of Function.2. Object does not have a property called constructor so when w ...
- 1034 Head of a Gang 图的遍历,map使用
命名冲突,导致编译失败.这大概就是之前看到的最好不要using namespace std:的原因
- [转]构建高性能MySQL体系
来源:http://www.yunweipai.com/archives/21232.html 构建高性能MySQL系统涵盖从单机.硬件.OS.文件系统.内存到MySQL 本身的配置,以及schema ...
- log4j的添加顺序
1.log4j的架包 <dependency> <groupId>org.slf4j</groupId> <artifactId>slf4j-api&l ...
- 基于面向方面和UML的实时系统建模研究
一.基本信息 标题:基于面向方面和UML的实时系统建模研究 时间:2010 出版源:计算机技术与发展 领域分类:面向方向:实时系统:横切关注点:统一建模语言: 二.研究背景 问题定义:实时系统建模研究 ...
- 【repost】Python正则表达式
星光海豚 python正则表达式详解 正则表达式是一个很强大的字符串处理工具,几乎任何关于字符串的操作都可以使用正则表达式来完成,作为一个爬虫工作者,每天和字符串打交道,正则表达式更是不可或缺的技 ...
- Docker构建JDK环境
创建目录mkdir oracle-jdk 构建文件touch Dockerfile # Docker for jdk-8u181 FROM centos:7 MAINTAINER ggza " ...
- orcale mysql基本的分页查询法
orcale分页查询sql语句: SELECT * FROM ( SELECT A.*, ROWNUM RN FROM (SELECT * FROM TABLE_NAME) A WHERE ROWNU ...