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. 使用GUI--tkinter 制作一个批量修改文件名的桌面软件

    ''' title:批量修改文件名称 author:huyang createtime:2021-01-29 14:50:00 ''' from tkinter import * from tkint ...

  2. Windows系统编译libhv带SSL,开启WITH_OPENSSL

    需要开发一个https的服务,使用libhv来做,需要重新编译libhv,需要开启 WITH_OPENSSL,前面编译一直很顺利,但是打开VS生成动态库的时候,报错,找不到ssl相关的文件,看了官方的 ...

  3. 【5】Spring IoC介绍

    有部分 Java 开发者对 IoC(Inversion Of Control)和 DI(Dependency Injection)的概念有些混淆,认为二者是对等的. IoC 其实有两种方式,一种就是 ...

  4. 了解redis的单线程模型工作原理?一篇文章就够了

    1.首先redis是单线程的,为什么redis会是单线程的呢?从redis的性能上进行考虑,单线程避免了上下文频繁切换问题,效率高:从redis的内部结构设计原理进行考虑,redis是基于Reacto ...

  5. js中“??“和“?.“怎么用?

    ??:空值合并操作符 逻辑操作符,左侧为null和undefined时,才返回右侧的数const sum = null ?? 12console.log(sum);//输出12const sum1 = ...

  6. 云原生微服务的下一站,微服务引擎 MSE 重磅升级

    ​简介:管好微服务,成为云原生时代的新难题. 管好微服务,成为云原生时代的新难题. 从建好微服务到管好微服务,差的虽是一个字,连接起两边的却需要大量的微服务落地经验.因为软件架构的核心挑战是解决业务快 ...

  7. 重度使用Flutter研发模式下的页面性能优化实践

    简介: 淘宝特价版是集团内应用Flutter技术场景比较多,且用户量一亿人以上的应用了.目前我们首页.详情.店铺.我的,看看短视频,及评价,设置等二级页面都在用Flutter技术搭建.一旦Flutte ...

  8. [Cryptocurrency] okex 获取行情的三种方式, ticker、depth、kline

    获取行情可以使用 ticker.depth.kline 这三种方式. ticker 得到的是最新一条的成交价行情数据记录. depth 得到的是指定条数的包含 成交价格 和 成交数量 的记录. kli ...

  9. jqGrid--统计列

    //数据表格 <div class="gridPanel" style="width:100%;"> @* 数据表格 *@ <table id ...

  10. 登录信息localStorage存储

    localStorage拓展了cookie的4K限制,与sessionStorage的唯一一点区别就是localStorage属于永久性存储,而sessionStorage属于当会话结束的时候,ses ...