https://segmentfault.com/blog/wangjihong

安装nodejs与NPM

下载nodejs的LTL版本,并安装

https://nodejs.org/en/

执行node -v检查版本

npm在安装nodejs的时候会自动安装,使用以下命令更新npm到最新版本

npm -g install npm
npm -v

安装淘宝npm

npm install cnpm -g --registry=https://registry.npm.taobao.org

安装vue-cli手脚架

cnpm install -g vue-cli

cmd进入你想创建工程的目录,指定工程目录,就可以开始创建工程了

vue init webpack project-dir
  • Project name (project-dir)  如果不改就默认使用目录名,当作工程名,工程名允许出现大写字母
  • Project description (A Vue.js project)  工程描述
  • Author (maobuji <16770864@qq.com>) 工程作者
  • Vue build (Use arrow keys): 有两个选项,推荐第一个

Runtime + Compiler: recommended for most users  运行加编译

Runtime-only: about 6KB lighter min+gzip, but templates (or any Vue-specific HTML) are ONLY allowed in .vue files - render functions are required elsewhere

  • Install vue-router? (Y/n)   安装vue-router
  • Use ESLint to lint your code? (Y/n)

Standard (https://github.com/standard/standard)

Airbnb (https://github.com/airbnb/javascript)

none (configure it yourself)

  • Set up unit tests (Y/n)

Jest

Karma and Mocha

none (configure it yourself)

  • Setup e2e tests with Nightwatch? (Y/n)

Should we run `npm install` for you after the project has been created? (recommended) (Use arrow keys)

Yes, use NPM

Yes, use Yarn

No, I will handle that myself

基本上一路回车下来,就可以了。

编译运行项目

cnpm install

npm run dev

如果install不成功,可以尝试运行  cnpm rebuild node-sass

执行run dev以后系统就会启动了,config/index.js文件中,提供了启动端口。默认是8080

访问http://localhost:8080 就可以看到欢迎页面了。

springboot+VUE(一)的更多相关文章

  1. springboot+vue前后端分离,nginx代理配置 tomcat 部署war包详细配置

    1.做一个小系统,使用了springboot+vue 基础框架参考这哥们的,直接拿过来用,链接https://github.com/smallsnail-wh/interest 前期的开发环境搭建就不 ...

  2. SpringBoot+Vue+WebSocket 实现在线聊天

    一.前言 本文将基于 SpringBoot + Vue + WebSocket 实现一个简单的在线聊天功能 页面如下: 在线体验地址:http://www.zhengqingya.com:8101 二 ...

  3. Springboot vue.js html 跨域 前后分离 shiro权限 集成代码生成器

    本代码为 Springboot vue.js  前后分离 + 跨域 版本 (权限控制到菜单和按钮) 后台框架:springboot2.1.2+ mybaits+maven+接口 前端页面:html + ...

  4. .gitignore 标准模板 -适用于SpringBoot+Vue项目 -Idea+VSCode开发

    .gitignore 标准模板 -适用于SpringBoot+Vue项目 node_modules/ target/ !.mvn/wrapper/maven-wrapper.jar ### STS # ...

  5. SpringBoot+Vue前后端分离,使用SpringSecurity完美处理权限问题

    原文链接:https://segmentfault.com/a/1190000012879279 当前后端分离时,权限问题的处理也和我们传统的处理方式有一点差异.笔者前几天刚好在负责一个项目的权限管理 ...

  6. SpringBoot + Vue + nginx项目部署(零基础带你部署)

    一.环境.工具 jdk1.8 maven spring-boot idea VSVode vue 百度网盘(vue+springboot+nginx源码): 链接:https://pan.baidu. ...

  7. 使用Docker部署Spring-Boot+Vue博客系统

    在今年年初的时候,完成了自己的个Fame博客系统的实现,当时也做了一篇博文Spring-boot+Vue = Fame 写blog的一次小结作为记录和介绍.从完成实现到现在,也断断续续的根据实际的使用 ...

  8. SpringBoot + Vue + ElementUI 实现后台管理系统模板 -- 后端篇(五): 数据表设计、使用 jwt、redis、sms 工具类完善注册登录逻辑

    (1) 相关博文地址: SpringBoot + Vue + ElementUI 实现后台管理系统模板 -- 前端篇(一):搭建基本环境:https://www.cnblogs.com/l-y-h/p ...

  9. SpringBoot + Vue + ElementUI 实现后台管理系统模板 -- 后端篇(一): 搭建基本环境、整合 Swagger、MyBatisPlus、JSR303 以及国际化操作

    相关 (1) 相关博文地址: SpringBoot + Vue + ElementUI 实现后台管理系统模板 -- 前端篇(一):搭建基本环境:https://www.cnblogs.com/l-y- ...

  10. Springboot+Vue实现仿百度搜索自动提示框匹配查询功能

    案例功能效果图 前端初始页面 输入搜索信息页面 点击查询结果页面 环境介绍 前端:vue 后端:springboot jdk:1.8及以上 数据库:mysql 核心代码介绍 TypeCtrler .j ...

随机推荐

  1. python基础(五)

    一.os模块 import os# os.rename(old,new)#重命名# os.remove(f)#删除文件 # os.mkdir('china/beijing') #创建文件夹# os.m ...

  2. post表单翻页保存搜索条件

    问题:搜索条件下的数据,进行翻页行为后,搜索条件丢失 1.搜索表单 2.翻页 解决:既然点击页面跳转的a标签使用的方法是GET,而点击“搜索”按钮使用的方法是POST,那么可以让点击a标签实际上就是提 ...

  3. 在VMware上安装CentOS6 64位操作系统

    ---恢复内容开始--- 1.创建新的虚拟机 2.选择自定义,点击下一步: 3.找到镜像位置,添加: 4.点击“稍后安装操作系统”,点击“下一步”: 5.默认点击“下一步”,然后分配CPU: 这里内存 ...

  4. vue2.0 微信分享

    需求:首页,列表页,详情页的分享,活动页分享并进行相关操作,比如分享一次活动次数加1 首先:阅读微信开发文档:https://mp.weixin.qq.com/wiki?t=resource/res_ ...

  5. hibernate二级缓存demo2

    @Test public void hello3(){ Session session=sessionFactory.openSession(); List list = session.create ...

  6. node中间件概念

    中间件就是请求req和响应res之间的一个应用,请求浏览器向服务器发送一个请求后,服务器直接通过request定位属性的方式得到通过request携带过去的数据,就是用户输入的数据和浏览器本身的数据信 ...

  7. JMeter安装时Binarys与Source,tgz与zip如何选择?

    在 http://jmeter.apache.org/download_jmeter.cgi   或 http://jmeter.apache.org/   的 Download  版块下载 JMet ...

  8. docker下搭建fastfds

    https://blog.csdn.net/weixin_40247263/article/details/81087726 搭建过程参考 作者 https://me.csdn.net/feng_qi ...

  9. c++——智能指针学习(shared_ptr和weak_ptr)

    先看一个例子:Stark和Targaryen家族你中有我,我中有你.我们设计以下类企图避免内存泄漏,使得析构函数都能调用到: #include<iostream> #include< ...

  10. jQuery: 判断from表单是否修改

    <script> $(function() { $("#myform :input").change(function(){ $("#myform" ...