vue-cil项目初始化

@小瘦子i

已于 2022-07-10 20:55:24 修改

阅读量366

点赞数

文章标签： vue.js 前端前端框架

于 2022-07-10 20:49:04 首次发布

本文链接：https://blog.csdn.net/qq_53222216/article/details/125710539

版权

Vue.js Node.js Vue CLI 项目创建环境配置

关键词由CSDN通过智能技术生成

前期准备

node环境，官网自行下载：地址

下载完成以后可以查看一下是否成功

win+R

查看目前node版本

node -v

全局安装vue，执行

npm install vue -g

全局安装vue命令行工具，即vue-cli 脚手架，

npm install vue-cli -g

创建vue-cil项目

创建一个文件夹

创建vue项目有很多指令对应的内容也有些许的不同，今天先介绍的是vue-cil官网的方法，后续会慢慢补充嗷

vue create hello-world

果断的按下回车！

建议自行配置一下，新手的话Eslint真的很不友好，bug太难找了，可能因为一个空格卡住一两个小时。这里的话大家自行所需，当然后期也可以继续添加，router和vuex建议添加。

vue使用vue2版本

最最后（依次输入蓝色的那两行指令）

打开你的浏览器输入localhost：8080 出现以下界面则说明创建成功

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

@小瘦子i

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

VUE-CLI初始化项目

AyayaOVO的博客

06-26

931

1、vue init命令讲解用vue init命令来初始化项目，具体使用方法如下： vue init <template-name> <project-name> init：表示要用vue-cli来初始化项目：表示模板名称，vue-cli官方提供的5种模板： webpack：一个全面的webpack+vue-loader的模板，功能包括热加载，linting,检测和CSS扩展。 webpack-simple：一个简单webpack+vue-loader的模板，不包含其他功能，让

vue-cli初始化项目

qq_29236119的博客

03-30

792

初始化项目时首先要弄清楚vue-cli的版本一、3.0以下版本命令 1、首先安装vue-cli，输入命令： cnpm install -g vue-cli 2、初始化项目，输入命令 vue init webpack my-project 二、3.0以上版本（推荐使用） 1、首先安装vue-cli，输入命令： cnpm install -g @vue/cli 2、初始化项目，输入命令 vue create my-project 需要注意的是vue-cli低版本和高版本的命令是不一样的，低版本的vue

参与评论您还未登录，请先登录后发表或查看评论

Vue.js之使用vue-cli初始化项目

Baby_加油_的博客

06-11

1360

使用vue框架的时候，经常会用到vue的脚手架，那么怎么进行初始化呢？一、安装步骤 step1、安装Node.js 首先需要下载并安装Node.js，下载地址：Node官网。测试安装是否成功，打开cmd，使用 node -v，如果显示版本号则表示安装成功。 step2、安装vue-cli 使用vue-cli（脚手架）搭建项目，vue-cli是Vue官方提供的用于搭建...

vue-cli初始化

Kevin李宏飞的博客

11-21

591

vue create vue-cli-demo

用vue-cli初始化一个vue项目

cxu123321的博客

02-16

419

用vue-cli初始化一个vue项目迷糊总关注 2019.03.13 13:35:28字数 640阅读 1,365 一.环境搭建 1.node下载（官网https://nodejs.org/en/download/）一路“下一步”就可以了 2.安装成功后，打开node 二.安装vue-cli脚手架构建工具：npm install vue-cli -g # 必须全局安装vu...

blueprintWeb:一个即将管理蓝图的Vue-cil网站

03-21

1. "npm install"：这是初始化项目依赖的命令，会根据package.json文件下载所有必要的依赖包。 2. "npm run serve"：这个命令启动了一个本地开发服务器，提供了热重载功能，即在代码变动时自动刷新页面，方便开发者...

基于 vue-cli 初始化 Vue2 模板的项目

weixin_66375317的博客

05-18

505

基于 vue-cli 初始化 Vue2 模板的项目

vue-cli.rar

12-24

Vue CLI 提供了一套快速开发Vue应用的标准配置，简化了项目的初始化过程，使得开发者可以更专注于业务逻辑，而无需关心底层配置。它内置了许多最佳实践，包括但不限于： 1. **项目初始化**：通过`vue create`命令，...

vue-cil4 打包优化(详细到脚指)

icon_Lx的博客

10-07

612

首先项目开始时webpack配置 vue-cli3以后，我们修改webpack配置，需要自己在项目的目录根路径下创建vue.config.js文件。 1、配置 proxy 跨域使用vue-cli开发项目，本地开发环境中，如果遇到跨域的问题。可以通过配置proxy的方式，解决跨域的问题：配置完成后，当我们在去请求https://www.test.com/v1/api/userinfo接口时，就可以这么写： 2、配置alias别名使用vue-cli开发项目，最大特色...

快速创建项目Vue-cil控制台使用

weixin_44756695的博客

07-29

651

对于很多初学者来说，创建项目命令行太多，再安装过程中容易出错，Vue官方的脚手架Vue-Cil3脚手架还是很强大方便的，现在带大家来体验一下：一、打开控制台，安装脚手架： npm install -g @vue/cli ps：国内网络不好的朋友们可以使用cnpm， mac的朋友们要记得加上sudo 二、启动服务安装完毕后，控制台打开：输入下面启动命令： vue ui vue-cil3控制...

初始化 Vue 项目（vue-cli）

listcvc的博客

06-05

1073

本文转载来自：作者：NathanYangcn链接：https://www.jianshu.com/p/45b5ce2ab1c5來源：简书一、初始化项目1. vue-clivue-cli 是 vue.js 的脚手架工具，可以帮助我们编写基础代码、快速搭建开发环境。使用 vue-cli 工具之前，首先安装 node 和 npm 包管理工具。2. 初始化项目步骤2.1 全局安装 vue-cli 工具np...

Vue-Cli初始化vue项目

wuyundong123的博客

12-30

709

在实际的工作项目开发中，由于都是使用node和npm进行vue-cli的安装，所以先确保已有node和npm的环境；查看node的版本 node -v 查看npm的版本 npm -v 一 Vue-Cli安装 vue-cli 是由 Vue 提供的一个官方 cli，专门为单页面应用快速搭建繁杂的脚手架。它是用于自动生成 vue.js+webpack 的项目模板；使用npm安装 npm install -g @vue/cli 查看是否安装成功： vue -V 但是由于npm.

【Vue 基础】vue-cli初始化项目及相关说明

最新发布

ChaoChao66666的博客

04-26

959

1. 创建项目 2. 项目文件介绍 3. 项目的其它配置 3.1 项目运行时，让浏览器自动打开 3.2 关闭eslint校验功能 3.3 src文件夹简写方法

【Vue全家桶】带你全面了解通过Vue CLI初始化Vue项目

QDCXYXZ_的博客

03-22

2253

详细总结通过Vue脚手架创建项目的流程，以及默认项目目录的文件结构

vue-cli 脚手架初始化项目

m0_53399639的博客

06-12

287

1. node + webpack +淘宝镜像2. 在项目根目录中在终端里初始化项目 vue create 项目名称3.node_modules文件夹中放置：项目依赖文件夹4.public文件夹：一般放置一些静态资源（图片），需要注意，放在public文件夹中的静态资源，webpack进行打包的时候，会原封不动打包到dist文件夹中。5.src文件夹（程序员源代码文件夹）： 1) assets文件夹：一般也是放置的是静态资源（一般放置多个组件公用的资源），需要注意，放置在assets文件夹

使用vue-cli初始化项目

qq_39309096的博客

12-09

310

一、首先安装node与npm 查询node的版本 node -v 查询npm的版本 npm -v 二、安装vue-cli 1、命令 npm install -g vue-cli ``` 安装后可用vue -V 查看版本三、初始化项目 ```vue init webpack myvue //myvue 是项目名 cd myvue 进入创建的项目启动脚手架 npm run dev 点击链...

Vue-cli脚手架初始化项目

Victor_1997的博客

02-22

168

首先创建项目文件夹，进入文件夹后输入cmd打开命令行输入vue create app会弹出以下指令，这里我选择的是vue2版本，输入回车之后项目就创建好了。创建好的项目用VScode打开后如下图，其中node_modeles文件夹是项目依赖，public文件夹是一些静态资源，src文件夹是源代码文件夹，babel.config.js是babel相关的配置文件，package.json是记录项目的文件，package-lock.json是缓存性文件，README.md是说明性文件。其中src文

vue-cli 初始化大型项目

AndyDJA的博客

01-02

1189

摘要：vue-cli 1.创建一个文件夹，在cmd 命令面板中执行：npm install -global vue-cli 全局安装 vue-cli 2.利用：vue init webpack projectName(自定义项目名称) 创建一个基于 webpack 模板的新项目（） 3.进入到项目名称文件夹中执行 npm install 安装项目所需要依赖 4.运行 npm run de

Vue环境安装、Vue-cli安装、初始化项目

Jackson_ji的博客

04-29

686

隔了近7月没敲过代码，连最初的Vue项目初始化都忘记了，今天有时间，回忆下；之后有时间还是天天的看会，不能忘了吃饭的家伙啊~~~~ Vue环境安装 1、安装node.js（版本不得低于8）全局安装，下载node的链接路径https://nodejs.org/en/，选择带有Current的安装；步骤只需next next就行，没有确认的规范；安装的盘符，你可以自己选择，之后检查node是否安...

vue-cil创建项目

04-04

Vue CLI 是 Vue.js 官方提供的一个快速开发的工具，它可以帮助开发者快速搭建 Vue.js 项目。以下是使用 Vue CLI 创建项目的步骤： 1. 安装 Vue CLI 首先需要安装 Vue CLI，可以使用 npm 或者 yarn 安装，建议使用 ...