首页 > 编程语言 >第一个vue-cli程序

第一个vue-cli程序

时间:2022-12-09 10:11:06浏览次数:40  
标签:npm vue cli cnpm 程序 install https

什么是vue-cli

  vue-cli官方提供的一个脚手架。用于快速生成一个vue的项目模板

  预先定义好的目录结构及基础代码,就好比在创建Maven项目时可以选择创建

一个骨架项目,这个骨架项目就是脚手架,开发就会更加快速

  主要功能:

  1.统一的目录结构

  2.本地调试

  3.热部署

  4.单元测试

  5.集成打包上线

 

需要的环境

Node.js: https://nodejs.cn.dowmload/

Git: https://git-scm.com/downloads

镜像: https://npm.taobao.org/mirrora/git-for-windows/

下载过程已在大前端进阶详细叙述

确认nodejs安装成功:
cmd下输入 node -v 查看是否能正确打印版本号

cmd下输入 npm -v 查看是否能正确打印版本号

这个npm就是一个软件包管理工具就和Linux下的apt软件安装差不多

 

安装Node.js淘宝镜像加速器(cnpm)

这样子的话,下载就会快很多

npm install cnpm -g

安装的位置C:\Users\Administrator\AppData\Roaming\npm

 

安装vue-cli

cnpm install vue-cli -g

查看可以基于哪些模板创建

vue list

 

第一个vue-cli程序

创建一个基于webpack模板的vue程序

vue init webpack myvue

 一路no即可

此时文件夹就多了一个myvue文件

 

 初始化并运行

npm install

此时myvue中多了一个node_modules文件

npm run dev

 访问此链接:

 

标签:npm,vue,cli,cnpm,程序,install,https
From: https://www.cnblogs.com/zhulei118/p/16966396.html

相关文章

  • CCSP学习笔记-chanp4-云应用程序安全
    1识别应用程序安全所需的培训和意识宣贯2理解软件研发生命周期(SDLC)流程3理解云应用程序架构的特性4实现安全软件研发生命周期5理解应用程序安全标准6理解云软件......
  • Chapter7_成为会使用面向对象编程的程序员吧
    理解面向对象编程热身问答Object翻译成中文是什么?对象对象(Object)是表示事物的抽象名词。OOP是什么的缩略语?ObjectOrientProgramming面向对象也可以简称......
  • vue3.x keep-alive 写法
     <template><divid="app"class="container"><router-viewv-slot="{Component}"><keep-alive:include="['peopleList','addressList'......
  • Element UI vue 上传文件、下载模板
    样式<el-uploadclass="upload-demo"action="/api/file/upload":on-remove="handleRemove"multipleref="uplpadFile":limit="1":on-ex......
  • Chapter4_程序像河水一样流动着
    热身问答FlowChart的中文意思是什么?流程图请说出自然界中河流的三种流动方式。顺流、逆流向着一个方向流淌;流着流着产生支流;卷成漩涡。与河流的流动方式一样,程......
  • vue的安装
    Vue-cli是vue官方出品的快速构建单页应用的脚手架,这里牵扯的东西很多,有webpack,npm,nodejs,babel等等。官网:https://cli.vuejs.org/guide/GitHub:https://github.com/vuejs/v......
  • vue组件介绍及应用
    一个.vue文件就是一个组件组件都是由三部分组成:html结构(html结构都是在template标签中)、js逻辑、css样式1)template只能解析一个根标签2)js逻辑都是在script标签中,必须设......
  • <9> 打包exe可执行程序
    pipinstallpyinstaller打包命令:#普通打包#pyinstaller-Fpy文件名称#执行exe可执行程序,会有cmd窗口被自动打开,记录程序运行日志#隐藏窗口打包#pyinstaller......
  • 使用vuedraggable实现拖拽式操作实战
    OverridetheentrypointofanimageIntroducedinGitLabandGitLabRunner9.4.Readmoreaboutthe extendedconfigurationoptions.Beforeexplainingtheav......
  • Vue 官方文档2.x教程学习笔记 1 基础 1.8 列表渲染 1.8.1 用 v-for 把一个数组对应为
    OverridetheentrypointofanimageIntroducedinGitLabandGitLabRunner9.4.Readmoreaboutthe extendedconfigurationoptions.Beforeexplainingtheav......