1、生成项目目录

使用vue自动化工具可以快速搭建单页应用项目目录。

该工具为现代化的前端开发工作流提供了开箱即用的构建配置。只需几分钟即可创建并启动一个带热重载、保存时静态检查以及可用于生产环境的构建配置的项目:

// 生成一个基于 webpack模板的新项目
vue create 目录名 例如:
vue create hello-world
// 启动开发服务器 ctrl+c 停止服务
cd hello-world
npm run serve // 运行这个命令就可以启动node提供的测试http服务器

  

运行了上面代码以后,终端下会出现以下效果提示:

那么访问:http://localhost:8080/

Vue cli之使用Vue-CLI初始化创建前端项目的更多相关文章

  1. 基于vue cli 3.0创建前端项目并安装cube-ui

    前提条件: 安装node.js. 国内的开发者最好先配置淘宝镜像. 之后用cnpm来代替npm命令. 项目创建过程: 打开cmd,输入命令进入目标工作空间,以本机项目为例: cd /d d: cd D ...

  2. Cordova+vue 混合app开发(一)创建Cordova项目

    简介: Cordova包装你的HTML/JavaScript app到原生app容器中,可以让你访问每个平台设备的功能.这些功能通过统一的JavaScript API提供,让你轻松的编写一组代码运行在 ...

  3. 2.【nuxt起步】-初始化创建nuxt项目

    1. 脚手架初始化: vue init nuxt-community/starter-template NuxtMyms 2.输入项目相关信息 3.切换到项目目录下 安装依赖 Cd nuxtmyms ...

  4. 【前端vue开发架构】vue开发单页项目架构总结

    为营销活动设计的前端架构 主要的技术栈为 Vuejs,Webpack,请自行阅读如下技术或者框架的文档: 一.基础说明: node (https://nodejs.org/en/) npm (http ...

  5. vue cli创建typescript项目

    使用最新的Vue CLI @vue/cli创建typescript项目,使用vue -V查看当前的vue cli版本 安装命令 npm install -g @vue-cli 创建项目 vue cre ...

  6. Vue CLI创建Vue2项目

    1.安装Node.js * Node.js中包含了npm工具 安装后查看版本: node -v npm -v 2.设置npm的源为国内源 npm config set registry https:/ ...

  7. [Vue 牛刀小试]:第十七章 - 优化 Vue CLI 3 构建的前端项目模板(1)- 基础项目模板介绍

    一.前言 在上一章中,我们开始通过 Vue CLI 去搭建属于自己的前端 Vue 项目模板,就像我们 .NET 程序员在使用 asp.net core 时一样,我们更多的会在框架基础上按照自己的开发习 ...

  8. [转]Vue CLI 3搭建vue+vuex 最全分析

    原文地址:https://my.oschina.net/wangnian/blog/2051369 一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@ ...

  9. Vue CLI 3搭建vue+vuex 最全分析

    一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@vue/cli 全局安装的 npm 包,提供了终端里的vue命令(如:vue create .vue ...

  10. Vue 框架-10-搭建脚手架 CLI

    Vue 框架-10-搭建脚手架 CLI + 批处理快捷启动 脚手架是通过 webpack 搭建的开发环境 使用 ES6 语法 打包和压缩 JS 为一个文件 项目文件在环境中,而不是浏览器 实现页面自动 ...

随机推荐

  1. locust常用的配置参数【locust版本:V1.1.1】

    locust 官网文档地址:https://docs.locust.io/en/stable/configuration.html Locust QQ 群: 执行命令如: master: locust ...

  2. Web前端 - Vue

    <!-- id标识vue作用的范围 --> <div id="app"> <!-- {{}} 插值表达式,绑定vue中的data数据 --> { ...

  3. React中受控组件和非受控组件

    一.受控组件 受控组件,简单来讲,就是受我们控制的组件,组件的状态全程响应外部数据 举个简单的例子: class TestComponent extends React.Component { con ...

  4. Python数据分析 Series 笔记

    002,pandas介绍 003,Series创建 导入Pandas Series 是一种类似于一维数组的对象,由下面两个部分组成: values:一组数据(ndarray类型) index:相关的数 ...

  5. 初接触:从创建工程到导出gerber(学习Altium Designer)

    学习Altium Designer Altium Designer的工程文件后缀为.PrjPcb,主要包含Source Documents和Libraries.Source Documents里面有S ...

  6. 力扣205(java)-同构字符串(简单)

    题目: 给定两个字符串 s 和 t ,判断它们是否是同构的. 如果 s 中的字符可以按某种映射关系替换得到 t ,那么这两个字符串是同构的. 每个出现的字符都应当映射到另一个字符,同时不改变字符的顺序 ...

  7. HarmonyOS NEXT应用开发案例——阻塞事件冒泡

    介绍 本示例主要介绍在点击事件中,子组件enabled属性设置为false的时候,如何解决点击子组件模块区域会触发父组件的点击事件问题:以及触摸事件中当子组件触发触摸事件的时候,父组件如果设置触摸事件 ...

  8. Java异步非阻塞编程的几种方式

    简介: Java异步非阻塞编程的几种方式 一. 从一个同步的Http调用说起 一个很简单的业务逻辑,其他后端服务提供了一个接口,我们需要通过接口调用,获取到响应的数据. 逆地理接口:通过经纬度获取这个 ...

  9. 如何避免JS内存泄漏?

    ​ 简介: 很多开发者可能平时并不关心自己维护的页面是否存在内存泄漏,原因可能是刚开始简单的页面内存泄漏的速度很缓慢,在造成严重卡顿之前可能就被用户刷新了,问题也就被隐藏了,但是随着页面越来越复杂,尤 ...

  10. [FAQ] Quasar SSR: Hydration completed but contains mismatches.

    使用 Quasar SSR 模式在 build 编译目标代码时,如果模板里有在服务端渲染阶段可能无法识别的变量,一般会出现这类提示. 比如在 layout 模板里使用了 this.$q.this.$r ...