一、需要安装和配置 Node.js 与 npm

二、Vue.js的安装或cdn引用:

  ·cdn引用(不适合项目开发):

    <script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.js"></script>

  ·npm安装:

    npm install vue

三、项目的创建

  1> 安装相关依赖与脚手架CLI

    · 全局安装脚手架:

      npm install -g vue-cli

      检测是否安装成功:vue -V

    · 安装 webpack 

      · 全局安装包:npm install -g webpack

      · 本地安装包:npm install -g webpack-dev-server

      检测是否安装成功:webpack -v

  2> 创建Vue项目

    1> vue init webpack "projectNmae" //projectName: 项目名称

    2> 项目选项:

      

    3> 运行项目:npm run dev,在浏览器中输入:localhost:8080进行测试,出现下图代表项目创建成功

     

    

Vue.js开发环境配置与项目创建的更多相关文章

  1. vue.js 开发环境配置

    1. node.js环境(npm包管理器) 下载: https://nodejs.org/en/download/current/ 下载解压版的方便 添加path环境后运行 npm包管理器,是集成在n ...

  2. Mac安装vue.js开发环境

    Mac安装vue.js开发环境 DannyHooDanny的专栏订阅 一.vue.js开发环境 二.初始化一个vue.js项目 三.vue.js项目打包部署 本来以为在Mac上搭建vue.js的环境挺 ...

  3. windows下vue.js开发环境搭建教程

    这篇文章主要为大家详细介绍了windows下vue.js开发环境搭建教程,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 最近,vue.js越来越火.在这样的大浪潮下,我也开始进入vue的学习行列中 ...

  4. Ionic2开发环境搭建、项目创建调试与Android应用的打包、优化

    Ionic2开发环境搭建.项目创建调试与Android应用的打包.优化. windows下ionic2开发环境配置步骤如下: 下载node.js环境,稳定版本:v6.9.5 下载android stu ...

  5. vue.js开发环境搭建以及创建一个vue实例

    Vue.js 是一套构建用户界面的渐进式框架.Vue 只关注视图层, 采用自底向上增量开发的设计.Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件. 在使用 vue.js ...

  6. cocos2dx - 环境配置,项目创建

    准备工具 cocos2dx当前最新版本:v3.9       官网下载地址: http://www.cocos.com/download/ python 2.7x最新版本:2.7.11       官 ...

  7. 在win10系统环境下,安装配置sublime 3,构建python和vue.js开发环境(插件)

    原文转载自「刘悦的技术博客」https://v3u.cn/a_id_131 疫情当下,最近一直在用mac下的虚拟机运行win10系统,由于在线人数过多,直播授课的时候使用vscode的时候内存暴涨,于 ...

  8. 搭建Vue.js开发环境(window10)

    我在配置Vue.js环境的时候遇到了很多的问题,希望能把这些解决方法也介绍给大家,希望能帮到大家,共同学习. 如果要转发,请注明原作者和原产地,谢谢! 注释:下面任何命令都是在windows的命令行工 ...

  9. [转]Mac下cocos2dx-3.2+Xcode环境配置和项目创建

    原文:http://blog.csdn.net/u012200908/article/details/38070885 这是有关环境配置的第二篇教程,第一篇讲的是win8下的环境配置.这里我们使用C+ ...

随机推荐

  1. 【LeetCode】303. Range Sum Query - Immutable 解题报告(Python)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 解题方法 保存累积和 日期 题目地址:https://leetcode. ...

  2. 【LeetCode】394. Decode String 解题报告(Python)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 栈 日期 题目地址:https://leetcode ...

  3. [LeetCode] 448. Find All Numbers Disappeared in an Array 找到数组中消失的数字

    题目描述 给定n个数字的数组,里面的值都是1-n,但是有的出现了两遍,因此有的没有出现,求没有出现值这个数组中的值有哪些. 要求不能用额外的空间(除了返回列表之外),时间复杂度n 思路 因为不能用额外 ...

  4. Docker 与 K8S学习笔记(九)—— 容器间通信

    容器之间可通过IP.Docker DNS Server或joined三种方式进行通信,今天我们来详细学习一下. 一.IP通信 IP通信很简单,前一篇中已经有所涉及了,只要容器使用相同网络,那么就可以使 ...

  5. Python 英语单词本

    python pymysql re requests socket库的简单运用 要考试了,这里用所学的知识做一个实例 pymysql库 这个库是用来连接数据库的,使用数据库语句在python里创建表和 ...

  6. Spring Boot实战二:集成Mybatis

    Spring Boot集成Mybatis非常简单,在之前搭建好的项目中加入Mybatis依赖的jar,在配置文件中加入数据库配置即可,如下图所示: 创建对应的Controller.Service.Da ...

  7. pytest之 fixture 实现机制

    一.相同测试数据存放优化 在讲 fixture 实现机制之前,插入一段内容 上次有个小伙伴问我说,类似下面的用例代码情况,每条测试用例的数据都一样的,我们可以怎么进行优化吗? 当然是可以的 其实我们可 ...

  8. 论文翻译:2020_ACOUSTIC ECHO CANCELLATION WITH THE DUAL-SIGNAL TRANSFORMATION LSTM NETWORK

    论文地址:https://ieeexplore.ieee.org/abstract/document/9413510 基于双信号变换LSTM网络的回声消除 摘要 本文将双信号变换LSTM网络(DTLN ...

  9. 制作四个选项卡页 Tab,用户可以通过切换不同的 Tab 页查看不同类别的新闻信息,每个 Tab 有对应的内容版块,点击某个选项卡时,显示对应的内容版块,隐藏其他内容版块,并且为了突出当前的选项卡,还

    查看本章节 查看作业目录 需求说明: 制作四个选项卡页 Tab,用户可以通过切换不同的 Tab 页查看不同类别的新闻信息,每个 Tab 有对应的内容版块,点击某个选项卡时,显示对应的内容版块,隐藏其他 ...

  10. Java面向对象笔记 • 【第9章 JDBC编程】

    全部章节   >>>> 本章目录 9.1 JDBC基础 9.1.1 JDBC简介 9.1.2 JDBC常用API简介 JDBC 常用API功能说明 9.1.3 JDBC编程步骤 ...