使用 Vue 脚手架

最新推荐文章于 2024-10-11 16:49:20 发布
最新推荐文章于 2024-10-11 16:49:20 发布
阅读量7.3k 收藏 1
点赞数
文章标签： vue.js npm javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/ALiMaMaYang/article/details/120882818
版权

3.1 初始化脚手架
3.1.1 说明

  1. Vue 脚手架是 Vue 官方提供的标准化开发工具（开发平台）。
  2. 最新的版本是 4.x。
  3. 文档: https://cli.vuejs.org/zh/。
  4. 3.1.2 具体步骤
  5. 第一步:安装npm,并配置环境
  6. 第二步（仅第一次执行）：全局安装@vue/cli。 npm install -g @vue/cli
  7. 第三步：切换到你要创建项目的目录，然后使用命令创建项目 vue create xxxx
  8. 第四步：启动项目 npm run serve
  9. 备注： 1. 如出现下载缓慢请配置 npm 淘宝镜像：npm config set registry https://registry.npm.taobao.org
VUE-使用vue脚手架创建项目
Robin的博客
04-02 952
1、创建存放项目的目录 2、进入目录 按住shift键 鼠标右击，打开powershell 3、在命令行窗口执行 vue ui 打开vue项目管理器 4、创建项目 1、选择项目存放位置 2、输入项目名，选择包管理器 3、选择预设，这边选择手动配置 4、勾选相关插件 5、选择vue.js版本，路由模式，eslint配置模式 6、创建项目，不保存预设。 也可以输入预设名保存预设并创建项目 7 、等待项目创建完成 8、项目创建完成 9、启动...
使用Vue脚手架（Vue cli）构建Vue项目
fakerking的博客
08-14 343
Vue脚手架
详解如何使用vue-cli脚手架搭建Vue.js项目
01-19
1. 前言 vue-cli 一个简单的构建Vue.js项目的命令行界面 整体过程： $ npm install -g vue-cli $ vue init webpack vue-admin $ cd vue-admin $ npm install $ npm run dev 后面分步说明。 2. 安装 前提条件，Node.js >=4.x版本，建议使用6.x版本。npm版本 > 3.x 全局安装vue-cli $ npm install -g vue-cli 3. 使用 $ vue init vue官方提供了多
VUE.JS-props声明接收
XiaoSen207的博客
11-29 357
<template> <div> <h1>{{msg}}</h1> <h2>学生姓名：{{name}}</h2> <h2>学生性别：{{sex}}</h2> <h2>学生年龄：{{myAge+1}}</h2> <button @click="updateAge">尝试修改收到的年龄</button> </div> </tem
使用Vue脚手架
weilaaer的博客
10-20 208
​ 注：以下的npm .... 指令是nodejs的功能，如未下载先自行前往nodejs官网下载安装 如果在cmd控制台运行npm install 等指令不成功，可以以管理员身份运行cmd试试 8.1、说明 8.2、具体步骤 第一步（仅第一次执行）：全局安装@vue/cli npm install -g @vue/cli 第二步：切换到你要创建项目的目录，然后使用命令创建项目 vue create xxxx 第三步：启动项目 npm run serve ​
使用vue脚手架
早早踏入养生行列
05-22 556
vue脚手架安装使用步骤安装node.js安装全局 vue-cli创建一个基于 webpack 模板的新项目安装模块所需依赖运行项目 安装node.js 在官网下载安装就行，在这里就不在叙述 安装全局 vue-cli 在 windows 下使用 powershell 来进行创建，先打开 powershell 在命令行内键入 npm install --global vue-cli 创建一...
Vue（三）使用Vue脚手架
weixin_58598560的博客
05-30 4305
/ 全局过滤器})// 定义全局指令// 指令与元素成功绑定时（一上来）},// 指令所在元素被插入页面时},// 指令所在的模板被重新解析时})//定义混入data() {return {x: 100,y: 200},})//给Vue原型上添加一个方法（vm和vc都能用）alert('你好啊！')1、拆分静态组件组件要按照功能点拆分，命名不要与html元素冲突2、实现动态组件考虑好数据的存放位置，数据是一个组件在用，还是一些组件在用：（1）
第 3 章：使用 Vue 脚手架
2203_75300307的博客
10-11 1635
1. 初始化脚手架 1.1 说明 Vue 脚手架是 Vue 官方提供的标准化开发工具（开发平台）。 最新的版本是 5.x。 文档: https://cli.vuejs.org/zh/ 1.2 具体步骤 第一步（仅第一次执行）：全局安装@vue/cli。 npm install -g @vue/cli 第二步：切换到你要创建项目的目录，然后使用命令创建项目 vue create xxxx（项目名称） 第三步：启动项目 npm run serve 备注： 如出现下载缓慢请配置 npm 淘宝镜像： np
使用vue脚手架（vue-cli）搭建一个项目详解
11-28
1.首先得下载node.js。方法可自行百度。...以上所述是小编给大家介绍的vue脚手架（vue-cli）搭建项目详解整合，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对
vue第三章 使用vue脚手架
WYT11的博客
08-22 251
第一步配置镜像位置 直接cmd执行 如出现下载缓慢请配置npm淘宝镜像：npm config set registry https://registry.npm.taobao.org 执行完上面操作后关闭当前窗口 安装脚手架 npm install -g @vue/cli （只有第一次使用vue脚手架的时候使用） 切换到你要创建项目的目录，然后使用命令创建项目 执行 vue create xxxx （项目名称不能是敏感词（vue，jquery）） 然后执行 npm run ser
vue的脚手架用法总结
qq_52827180的博客
11-17 1970
vue的脚手架总结一、vue的脚手架环境搭建1.配置node环境，npm环境2.在cmd中安装vue3.安装完后打开项目项目结构public存放静态css,js等文件和index.html项目结构src下components为组件也就是vc，外面app.vue为总的组件，main.js为vm，通过new vue的el绑定html中的id来实现组件呈现到页面二、vue中脚手架语法1.ref属性ref属性和id很相似，通过this.$refs可以获得这个组件的vc对象或这个button的dom对象2.prop.
vue脚手架的使用，下载依赖方法
团酱
12-12 8965
安装： npm install -g @vue/cli 创建一个文件夹 vue create pro 选择Manually select features 自行进行配置（下面的进行参照） 之后进入 文件 并运行 cd pro npm run serve 浏览器中打开即可 ...
VUE-脚手架搭建
xhmico的博客
12-15 3455
vue 有两个大版本，分别是 vue-2 和 vue-3，目前新项目的话用 vue-3 的会比较多以下我会分别提供搭建 vue-2 和 vue-3 脚手架的过程。
Vue脚手架的使用
Pig-pig-pig的博客
05-17 608
提示：本文主要对Vue-cli脚手架进行总结 文章目录前言一、创建Vue脚手架二、分析脚手架结构三、 前言 提示：这里可以添加本文要记录的大概内容： 我们已经学习了Vue里的组件化，在里面我们知道，组件一般要配合脚手架vue-cli来使用， 本篇文章将对 vue的脚手架进行总结 提示：以下是本篇文章正文内容 一、创建Vue脚手架 二、分析脚手架结构 三、 ...
VUE 3——3：脚手架构建工具介绍及在创建 Vue 3 项目中的应用
dangfulin的博客
04-14 4036
这是针对 Vue 新人的一个简单指导。 在前面的文章中，我们不推荐新手直接使用 vue-cli，（尤其是在还不熟悉基于 node.js 的构建工具时），而是通过直接引用的方式： <script src="https://unpkg.com/vue@next"></script> 随着页面中组件越写越多，单个 HTML 文件终究无法完成实际的整个 Vue 项目，同时为了对 Vue 的使用有个整体的了解，这里将展示如何通过脚手架工具创建 Vue 3 项目以及一些前置说明。 文章目录一，
01-使用vue脚手架搭建项目
寒雪谷
12-25 1242
使用vue脚手架搭建项目 Vue项目开发实战系列 主要内容： 初识vues 升级到vue cli4.0 从零开始配置vue cli4.0 使用vue cli4.0创建项目 1 初识vue 1.1 Vue概述 我们就直接开门见山，看看Vue的官网吧： Vue官网： https://cn.vuejs.org/ 从官网中，我们可以知道： Vue是什么 Vue是一套用于构建用户界面的渐进式Jav...
Vue脚手架安装&搭建Vue项目
BHK
04-03 1480
Vue脚手架基本使用方法
wgchen
02-03 577
1 安装3X版本的Vue脚手架 npm install -g @vue/cli cnpm install -g @vue/cli C:\Users\Administrator>vue -V @vue/cli 4.2.2 2 创建项目图形界面启动 [root@bogon ~]# vue ui ???? Starting GUI… ???? Ready on http://localhost:8000 3 选择路径创建新项目 下一步 4 手动配置项目 5 选择开启功能 Babel 是一个工具链
如何使用vue脚手架
最新发布
12-30
### 使用 Vue CLI 创建和管理项目 Vue CLI 提供了一种高效的方法来初始化新的 Vue.js 项目并对其进行维护。通过这个工具，开发者能够利用预配置好的设置迅速启动开发工作。 #### 安装 Vue CLI 为了使用 Vue CLI 工具，首先需要安装它。由于这是一个基于 Node.js 的命令行工具，因此确保已经安装了 Node.js 和 npm (Node Package Manager)[^1]。 可以通过运行以下命令全局安装 Vue CLI： ```bash npm install -g @vue/cli ``` 这使得 `vue` 命令可以在任何地方被调用。 #### 创建新项目 一旦 Vue CLI 被成功安装，在命令提示符窗口中选择好项目的存储目录之后，可以使用 `vue create` 指令创建一个新的项目实例。例如，要创建名为 `myapp` 的应用（请注意，项目名应全部采用小写字母），则需执行如下命令[^2]: ```bash vue create myapp ``` 这条命令会引导用户完成一系列选项的选择过程，比如挑选特性、配置文件的位置等，从而定制化生成项目结构。 #### 进入项目目录并启动服务 当项目构建完成后，进入刚刚创建的应用程序所在的文件夹: ```bash cd myapp ``` 接着就可以启动本地服务器来进行实时预览了： ```bash npm run serve ``` 此操作会在默认浏览器打开应用程序，并自动监听源码的变化以便即时刷新页面显示最新的更改效果。 #### 构建生产版本 对于准备部署到线上的项目来说，应该先将其编译成适合生产的优化版本。为此，只需在一个终端里键入下面的命令即可实现打包发布版资源的目标： ```bash npm run build ``` 该命令将会把所有的静态资产压缩处理后放置于 `/dist` 文件夹内等待上传至目标环境之中。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值