Vue-cli脚手架的下载

这篇具有很好参考价值的文章主要介绍了Vue-cli脚手架的下载。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

  • Vue-cli

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

  • 预先定义好的目录结构及其基础代码,好比创建Maven项目时可以选择创建一个骨架项目,

  • 主要的功能: 统一的目录结构、本地调试、热部署、单元测试、集成打包上线

  • Node.js : 下载 | Node.js 中文网

  • CTRL + window 输入cmd输入node -v查看Node.js的版本

  • CTRL + window 输入npm-v 查看能否正确打印出版本号

  • npm,是一个软件管理工具,和linux下的apt软件软件差不多

  • 安装Node.js用淘宝镜像加速器,下载更快

  • Node.js下载完毕自动配环境,无需手动配

  • 下载Node.js附带有npm,可以用npm下载cnpm

安装cnpm

  • 全局安装:解决npm下载速度慢的问题

  • npm install cnpm -g
  不用全局安装则需要,每次下载加入如下代码解决速度慢的问题。
 npm install --registry=https://registry.npm.taobao.org
  • 安装vue-cli

  • cnpm install vue-cli -g
  • 用vue list可以查看是否安装成功

    • Vue-cli脚手架的下载,前端
    • Vue-cli脚手架的下载,前端
    • 生成vue的框架

    • 三个内容,一个选择。四个选择

  • Vue-cli脚手架的下载,前端
  • 完成了,会在D:\javafile\VScode\Vue-code原本的文件中生成myvue的文件

  • 在myvue文件下安装npm

  • Vue-cli脚手架的下载,前端
  • 如果代码出现错误,系统会自动给出修复代码

  • Vue-cli脚手架的下载,前端
  • 基于myvue的控制窗口中

  • 安装Vue的框架

  • npm install
  • 运行Vue的框架

  • npm run dev
  • 执行上面的代码后,webpack会进行打包操作,将ES6的代码,换成浏览器支持的ES5代码。控制窗口会运行,访问该地址即可看到vue框架

  • Vue-cli脚手架的下载,前端
  • CTRL + C 可以结束运行。文章来源地址https://www.toymoban.com/news/detail-731269.html

到了这里,关于Vue-cli脚手架的下载的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • vue-cli 脚手架创建uniapp项目(微信小程序)

    1、全局安装 vue-cli 脚手架(不建议用 5.0 版本,避免报错) 2、脚手架创建项目 3、选择 默认模板 即可 4、编译并启动项目  5、开发者工具,导入项目,注意路径 \\\"项目地址/dist/dev/mp-weixin\\\" 开发的规范 不能直接在开发者工具中修改代码,口诀:vscode做开发,开发者工具做调试

    2024年02月09日
    浏览(58)
  • vue-cli5脚手架搭建项目过程详解 -vue组件单元测试

    单元测试是对软件中的最小可测试单元进行测试。(最小可测试单元是要有结果产出的。例如某个方法,单独的某个操作) 单元测试其实是伴随着敏捷开发,它是对更快开发的一种追求。早发现错误比晚发现错误会更好,保证自己的代码符合要求 一: 搭建基于 jest 的 vue 单元

    2023年04月14日
    浏览(111)
  • 【每天学习一点点 day04】工程化 npm create 脚手架 create-vue, vue-cli 执行原理① - npm cli

    希望我们每个人都能找到属于自己的花期,不急不躁,静等风来。 今天打算用 Docusaurus 开始搭建自己的知识库,之前早已有此想法,遗憾的是没有坚持下来。 这次借助这个机会,也计划将自己【每天学习一点点】系列整理在自己的知识库中,方便大家查找。 在使用脚手架命

    2024年02月22日
    浏览(68)
  • Webpack项目学习:Vue-cli(脚手架)-优化配置 -ui库element-plus+减小打包体积 -按需加载+自定义主题+优化

    安装 全部引入,在入口文件main.js  启动:npm start  按需引入 需要插件快速开始 | Element Plus (gitee.io)     更改默认配置 主题 | Element Plus (gitee.io)    如果有模块没有安装 ,安装一下即可 优化 关闭性能分析 文件单独打包 做缓存-

    2024年02月08日
    浏览(72)
  • vue-cli脚手架创建创建的项目打包后无法正常打开报 Failed to load resource: net::ERR_FILE_NOT_FOUND错误

    亲爱的小伙伴们,你们最近是否有遇到用使用最新的脚手架打包项目后index.html文件无法正常打开,然后控制台报错的情况呢,不要担心,这个坑今天被我踩到了并且被我解决了,下边就让我来给大家分享一下经验吧! 1.找到vue.config.js文件,进行如下配置 即添加一行配置:

    2024年02月15日
    浏览(56)
  • vue 脚手架新手入门(vue cli 3)

    “:” 是指令 “v-bind”的缩写。用来绑定数据 @”是指令“v-on”的缩写。用来监听,并调用方法 下面是绑定class属性的数值。 监听点击动作 1.1、v-model 双向绑定 双向绑定 上面的操作等于 v-model 会将被绑定的值与 的值自动同步,这样我们就不必再使用事件处理函数了。 v-mo

    2024年02月09日
    浏览(159)
  • 17-工程化开发 & 脚手架 Vue CLI

    1.核心包传统开发模式: 基于 html/css /js 文件,直接引入核心包,开发 Vue。 2. 工程化开发模式: 基于构建工具 (例如: webpack)的环境中开发 Vue。    问题:         1. webpack 配置不简单         2. 雷同的基础配置         3. 缺乏统一标准 需要一个工具,生成标准化的配置 基本介

    2024年02月11日
    浏览(67)
  • 前端架构: 脚手架之Chalk和Chalk-CLI使用教程

    Chalk Chalk 是粉笔的意思, 它想表达的是,给我们的命令行中的文本添加颜色类似彩色粉笔的功能 在官方文档当中,它的 Highlights 核心特性 它的性能很高,没有三方依赖 它能够支持256以及真彩色的实现 也就是说这个库可以让你自己去定义它的色彩 并不是说命令行中当中的25

    2024年02月21日
    浏览(62)
  • Vue2学习之第三章——Vue CLI脚手架

    文档:https://cli.vuejs.org/zh/ 具体步骤 第一步(仅第一次执行):全局安装@vue/cli。 npm install -g @vue/cli 第二步:切换到你要创建项目的目录,然后使用命令创建项目 vue create xxxx 第三步:启动项目 npm run serve 备注: 如出现下载缓慢请配置 npm 淘宝镜像:npm config set registry https:/

    2024年01月19日
    浏览(202)
  • 处理解决运行前端脚手架工程报错: ‘vue-cli-service‘ 不是内部或外部命令,也不是可运行的程序 或批处理文件。附带 Linux

    目录 一、场景介绍 二、处理方式         1、 如果 package.json 配置没有 vue-cli-server 那么就安装它即可,注意安装完毕需重启编辑器启动项目,避免依赖添加不生效问题         2、如果 package.json 配置有 vue-cli-server 或者安装了还是没好,可以看看 node_modules 工程模块是否存

    2024年02月22日
    浏览(68)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包