使用vue-cli脚手架创建一个webpack-simple的vue框架项目

最新推荐文章于 2021-05-20 10:15:35 发布
最新推荐文章于 2021-05-20 10:15:35 发布
阅读量213 收藏 1
点赞数
分类专栏： # vue 文章标签： Vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_35653657/article/details/113851408
版权

第一步:进入工程目录,打开cmd

在这里插入图片描述

第二步:选择你要创建的vue框架

输入vue list
在这里插入图片描述

第三步:创建一个webpack-simple的vue框架

  • 创建框架结构
    在这里插入图片描述
  • 选择相关的配置
    在这里插入图片描述
  • 导入依赖
    在这里插入图片描述
  • 打开node.js服务器
    在这里插入图片描述
    部署成功
    在这里插入图片描述
    注意:前提条件是要安装了node.js
Alan and fish
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue使用vue-cli快速创建工程
01-19
vue-cli 是一个官方发布 vue.js 项目脚手架，使用 vue-cli 可以快速创建 vue 项目。 -g代表全局安装。 i就是install的缩写。 其中webpack-simple代表模板的名称。vue-todos是你给自己的项目起的名称，这个随便起...
使用vue-cli创建webpack-simple骨架并配置vue-router路由模块
王维佳的专栏
05-21 547
1.vue路由的官方解释： Vue Router是Vue.js的官方路由器。它与Vue.js核心深度集成，使使用Vue.js轻松构建单页应用程序变得轻而易举。功能包括： 嵌套路线/视图映射 模块化，基于组件的路由器配置 路由参数，查询，通配符 查看由Vue.js过渡系统提供动力的过渡效果 细粒度的导航控制 与自动活动CSS类的链接 HTML5历史记录模式或哈希模式，在IE9中具有自动备用 可自定义的滚动行为 ...
关于使用Vue-cli脚手架配合webpack-simple构建项目操作流程（自用）
weixin_42283462的博客
06-04 2715
1、vue-cil构建项目：官网的介绍vue-cil是vue的脚手架工具。其模板可以通过 vuejs-templates 来查看。我们不需要知道它究竟是什么，只需要知道它是一个工具帮助我们辅助开发，而我们所要做的就是安装上它，来方便我们的开发。下面，我们来用vue-cil构建一个项目。首先，我们在终端中把当前目录定位到你准备存放项目的地方。即自己定义的一个目录下面我们首先需要安装vue-cil。我...
使用vue-cli搭建一个简单的webpack项目
xiaozhuzhuyang的博客
05-20 549
使用vue-cli搭建一个简单的webpack项目 vue-cli是官方提供的一个脚手架，用于快速开发生成一个vue项目模板。 开始搭建 首先搭建nodejs环境 1.安装node.js 官网下载nodejs 2.配置nodejs环境变量 3.检测环境变量 补充：因为npm是到国外下载镜像，比较慢，所以我们可以使用cnpm npm install cnpm -g npm install --registry=http://registry.npm.taobao.org 搭建vue-cli环境 1.下载
vue-cli脚手架和webpack-simple模板项目
anmi3721的博客
10-16 549
一、脚手架介绍 　　前端开发中提到的“脚手架”是一个形象的比喻，比喻各类语言的前期工作环境。 　　在软件开发中（包括前端开发）的脚手架指的是：有人帮你把开发过程中要用到的工具、环境都配置好了，让程序员可以方便地直接开始做开发，专注于业务，而不用再花时间去配置这个开发环境，这个开发环境就是脚手架。 　　比如vue.js就有个vue-cli脚手架，基于node.js的开发环境，作者将开...
【Vue】Vue-cli程序 webpack使用 vue-router路由
高朗的博客
12-07 244
文章目录配置环境Node.js安装安装cnpm安装vue-cligit安装创建vue-cliwebpack安装 配置环境 Node.js安装 下载网站：http://nodejs.cn/download/ 安装流程：一路Next即可 安装完后，进入cmd检测是否安装成功 这个npm,就是一个软件包管理工具,就和linux下的apt软件安装差不多。 安装cnpm 安装Node.js 淘宝镜像加速器(cnpm)：这样子的话,下载会快很多 # -g 全局安装 npm install cnpm -g 如
vue脚手架vue-cli的学习使用教程
12-07
vue-cli的脚手架项目模板有webpack-simple 和 webpack 两种的区别在于webpack-simple 没有包括Eslint 检查等功能 vue-cli的项目结构 . |-- build // 项目构建(webpack)相关代码 | |-- build.js // 生产环境构建...
详解vue-router和vue-cli以及组件之间的传值
12-10
首先简单介绍使用vue-router的四个基本步骤：（为了方便演示，所有代码都写在一个文件里） 1.定义组件 2.定义路由 3.创建router实例并将定义好的路由传入 4.创建和挂载根实例 再来说一下vue-cli 一、...
使用vue官方提供的模板vue-cli搭建一个helloWorld案例分析
11-27
安装脚手架npm install vue-cli -g 创建项目 在硬盘上找一个文件夹放工程用的，在终端中进入该目录,cd目录路径 根据模板创建项目,vue init webpack-simple 工程名字<工程名字不能用中文>，vue init webpack 工程...
vue-cli的工程模板与构建工具详解
12-11
vue-cli提供的脚手架只是一个最基础的，也可以说是Vue团队认为的工程结构的一种最佳实践。对于初学者或者以前曾从事AngularJS/React开发的用户来说，可能对开发环境有自已习惯性用法和熟悉的工具，但我建议用Vue来...
vue-cli脚手架安装和webpack-simple模板项目生成
weixin_34384915的博客
01-04 127
一、vue-cli安装 vue-cli是一个官方vue.js项目脚手架，使用vue-cli可以快速创建vue项目。 安装vue-cli前，请确保已安装nodejs。 // 安装vue-cli，淘宝镜像安装 cnpm install vue-cli -g 如果安装失败，可以使用npm cache clean清理缓存，然后再重新安装；如果再失败，还需清理缓存。安装完成后，可以使用vu...
结合webpack使用vue-router和它的子路由，即路由嵌套
daxianhuan2484的博客
09-16 264
在上一个项目的基础上进行的，所以基本的配置在这里就不赘述了。 一、结合webpack使用vue-router 1.新建组件.vue文件 2.启用路由 安装插件cnpm i vue-router -S PS：npm install name -save 简写（npm install name -S） 　　 npm install name -save-d...
vue + webpack（webpack-simple）安装教程
siriva的博客
10-15 1483
创建项目名称（不能用中文），进入文件夹，按住shift键点击鼠标右键，打开命令行工具。在此建议首先检查环境是否安装完成。 npm--version 若已安装，走下一步…… 安装vue-cli npm install -g vue-cli 是否全局安装按需。 安装webpack-simple vue init webpack-simple myapp 进入文件夹 cd mya...
搭建vue项目及基本配置（vue+webpack+axios)
我的blog屋
02-21 746
前期准备 全局安装 node vue-cli 初始化项目 使用vue的脚手架直接在本地初始化项目 方法：命令行：vue init <template-name> <project-name> template-name选项为模板名称，vue-cli官方为我们提供了5种模板。 webpack-一个全面的webpack+vue-loader的模板，功能包括热加载，linti...
创建vue项目 使用vue-cli创建
BookNoteY的博客
08-07 339
vue init webpack myprojectname 构建简单项目 vue init webpack-simple myprojectname   vue create myprojectname
基于SSM+JSP的企业人事管理信息系统毕业设计(源码+录像+说明).rar
05-09
基于SSM+JSP的企业人事管理信息系统毕业设计(源码+录像+说明).rar 【项目技术】 开发语言：Java 框架：ssm+jsp 架构：B/S 数据库：mysql 【演示视频-编号：420】 https://pan.quark.cn/s/b3a97032fae7 【实现功能】 实现了员工基础数据的管理，考勤管理,福利管理,薪资管理,奖惩管理,考核管理,培训管理,招聘管理,公告管理,基础数据管理等功能。
node-v6.12.0-linux-ppc64le.tar.xz
最新发布
05-09
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
node-v6.8.0-linux-ppc64le.tar.xz
05-09
Node.js，简称Node，是一个开源且跨平台的JavaScript运行时环境，它允许在浏览器外运行JavaScript代码。Node.js于2009年由Ryan Dahl创立，旨在创建高性能的Web服务器和网络应用程序。它基于Google Chrome的V8 JavaScript引擎，可以在Windows、Linux、Unix、Mac OS X等操作系统上运行。 Node.js的特点之一是事件驱动和非阻塞I/O模型，这使得它非常适合处理大量并发连接，从而在构建实时应用程序如在线游戏、聊天应用以及实时通讯服务时表现卓越。此外，Node.js使用了模块化的架构，通过npm（Node package manager，Node包管理器）,社区成员可以共享和复用代码，极大地促进了Node.js生态系统的发展和扩张。 Node.js不仅用于服务器端开发。随着技术的发展，它也被用于构建工具链、开发桌面应用程序、物联网设备等。Node.js能够处理文件系统、操作数据库、处理网络请求等，因此，开发者可以用JavaScript编写全栈应用程序，这一点大大提高了开发效率和便捷性。 在实践中，许多大型企业和组织已经采用Node.js作为其Web应用程序的开发平台，如Netflix、PayPal和Walmart等。它们利用Node.js提高了应用性能，简化了开发流程，并且能更快地响应市场需求。
基于PaddleFL框架的联邦学习医疗影像识别系统源码+GUI界面+说明（高分）.zip
05-09
基于PaddleFL框架的联邦学习医疗影像识别系统源码+GUI界面+说明.zip该项目是个人毕设项目源码，评审分达到97分，都经过严格调试，确保可以运行！放心下载使用。该项目资源主要针对计算机相关专业的学生或从业者下载使用，也可作为期末课程设计、课程大作业、毕业设计等。 基于PaddleFL框架的联邦学习医疗影像识别系统源码+GUI界面+说明.zip该项目是个人毕设项目源码，评审分达到97分，都经过严格调试，确保可以运行！放心下载使用。该项目资源主要针对计算机相关专业的学生或从业者下载使用，也可作为期末课程设计、课程大作业、毕业设计等。 基于PaddleFL框架的联邦学习医疗影像识别系统源码+GUI界面+说明.zip该项目是个人毕设项目源码，评审分达到97分，都经过严格调试，确保可以运行！放心下载使用。该项目资源主要针对计算机相关专业的学生或从业者下载使用，也可作为期末课程设计、课程大作业、毕业设计等。 基于PaddleFL框架的联邦学习医疗影像识别系统源码+GUI界面+说明.zip该项目是个人毕设项目源码，评审分达到97分，都经过严格调试，确保可以运行！放心下载使用。该项目资源
vue-cli-webpack:vue-cli 2.9.6版本初始化webpack工程
09-07
vue-cli是一个构建Vue.js工程的脚手架工具，帮助开发者快速搭建和管理Vue.js项目。而vue-cli 2.9.6版本是其一个较早的版本，可以使用它来初始化一个基于webpack的Vue.js工程。 使用vue-cli 2.9.6版本初始化webpack工程，首先需要确保本地已安装了node.js和npm。 在命令行中执行以下命令来安装vue-cli： ``` npm install -g vue-cli@2.9.6 ``` 安装完成后，可以使用以下命令来初始化一个webpack工程： ``` vue init webpack my-project ``` 这里的"my-project"是你自定义的项目名称，可以替换为其他名称。 执行上述命令后，vue-cli会根据webpack模板生成项目的基本结构和文件。 接着，需要进入项目文件夹： ``` cd my-project ``` 然后执行以下命令来安装项目所需的依赖： ``` npm install ``` 安装完成后，可以使用以下命令来启动项目： ``` npm run dev ``` 这样，webpack工程就成功初始化并启动了。通过访问http://localhost:8080，可以在浏览器中查看项目的运行效果。 在初始化的工程中，可以编辑和修改src目录下的文件，这里的主要文件包括App.vue和main.js，分别是Vue组件和入口文件。 总之，使用vue-cli 2.9.6版本初始化webpack工程能够为开发者提供一个基于webpack的Vue.js开发环境，使他们能够更高效地进行Vue.js项目的开发和管理。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值