Windows 下 Vue-cli 及 Webpack 搭建安装环境
在现代 Web 开发中，Vue-cli 和 Webpack 是两个非常重要的工具，前者是 Vue.js 的脚手架工具，可以快速构建 Vue 项目，而后者是目前最流行的模块打包工具。本文将详细介绍如何在 Windows 下搭建 Vue-cli 及 Webpack 环境，并且详细讲解每一步的安装和配置过程。
一、安装 Node.js
Node.js 是目前最流行的 JavaScript 运行时环境， Vue-cli 和 Webpack 都依赖于 Node.js 环境。需要从 Node.js 官方网站下载并安装 Node.js，下载地址为：https://nodejs.org/en/download/。安装完成后，可以通过输入 "npm -v" 来测试是否成功安装。
二、安装 npm
npm 是 Node.js 的包管理工具，用于安装和管理项目依赖项。由于新版的 Node.js 已经集成了 npm，所以之前 npm 也一并安装好了。可以通过输入 "npm -v" 来测试是否成功安装。如果安装的是旧版本的 npm，可以通过 npm 命令来升级，命令如下：npm install npm -g。
此外，也可以使用淘宝定制的 cnpm（gzip 压缩支持）命令行工具代替默认的 npm，命令如下：npm install -g cnpm --registry=https://registry.npm.taobao.org。这样就可以使用 cnpm 命令来安装模块了，例如：cnpm install [name]。
三、安装 Vue-cli
Vue-cli 是 Vue.js 的脚手架工具，用于快速构建 Vue 项目。可以通过 npm 命令来安装 Vue-cli，命令如下：npm install -g vue-cli。这个命令只需要运行一次就可以了。安装完成后，以后就不用安装了。
四、使用 Vue-cli 构建项目
在终端中把当前目录定位到准备存放项目的地方。例如，如果准备放在 E:\vue 这个目录下面，那么先通过 cmd 命令进入这个目录，命令如下：cd vue。
然后，使用 Vue-cli 构建一个项目，命令如下：vue init webpack demo01。这将新建一个名为 demo01 的 Vue 项目。
五、安装项目依赖项
在项目目录下，使用 cnpm 命令安装项目依赖项，命令如下：cnpm install。这将安装项目所需的所有依赖项。
六、启动项目
安装完成项目依赖项后，使用 npm 命令启动项目，命令如下：npm run dev。这将启动开发服务器，并自动打开一个浏览器窗口，显示项目的实际效果。
本文详细介绍了如何在 Windows 下搭建 Vue-cli 及 Webpack 环境，并且详细讲解了每一步的安装和配置过程。希望对大家的学习有所帮助，也希望大家多多支持我们。
2025-06-20 15:54:32
160KB
1
电子
vueCli + electron12.0.0
调用C# DLL
electron-updater在线更新
项目设置
npm install
为开发编译和热重载
npm run serve
为生产编译和缩小
npm run build
Lints 和修复文件
npm run lint
自定义配置
请参阅。
地方发展（重要）
npm run electron:serve
打包上线（重要）
npm run electron:build
调用 C# DLL（xxx.vue 调用）
添加DLL操作等
将 C#DLL 放入根目录 /** (public/resources) */
修改文件 /** 下路径（ src/background.js ） */
在background.js里的(调用dll (模块) start)区域里添加dll操作
1. background.js:
2022-06-21 16:24:07
551KB
1
基于vue-cli构建的财务后台管理系统(vue2 vuex axios vue-router element-ui echarts websocket vue-i18n)
2022-03-13 14:06:45
204KB
1
适用人群具有一定javaScript基础具有一定Vuejs基础
课程概述本季度基于Vuecli +?elementUI实战开发商城后台管理系统完整视频教程，其中包括vuex模块化管理、Vue-router二次封装、使用element-ui库、支付模块、多权限管理、商品多规格实现、对象存储、api接口安全以及部署服务器上线等知识等。
课程大纲见以下图！
2021-12-22 11:26:02
439B
1
基于vue-cli模板的多页面多路由项目，一个PC端页面入口，一个移动端页面入口，且有各自的路由， vue webpack vue-router vuex mock axios
2021-11-29 22:58:01
1.17MB
1