Vue系列之十二: 实战快速上手

最新推荐文章于 2025-07-09 23:40:53 发布

林中静月下仙

最新推荐文章于 2025-07-09 23:40:53 发布

阅读量301

点赞数 1

CC 4.0 BY-SA版权

分类专栏： Vue 文章标签： vue

本文为博主原创文章，未经博主允许不得转载。

本文链接：https://blog.csdn.net/qq_21137441/article/details/123768364

Vue 专栏收录该内容

16 篇文章 ¥9.90 ¥99.00

订阅专栏

超级会员免费看

本文通过实战演练，详细介绍了如何使用Vue创建工程、配置路由、实现登录页面、组件重定向、参数传递以及404错误页。涉及到Vue-router、ElementUI、sass-loader的安装和使用，以及路由模式、路由钩子和异步请求的应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

我们采用实战教学模式并结合ElementUI组件库，将所需知识点应用到实际中，以最快速度带领大家掌握Vue的使用；

12.1、创建工程

注意：命令行都要使用管理员模式运行
1、创建一个名为hello-vue的工程vue init webpack hello-vue
2、安装依赖，我们需要安装vue-router、element-ui、sass-loader和node-sass四个插件

#进入工程目录
cd hello-vue
#安装vue-routern 
npm install vue-router --save-dev
#安装element-ui
npm i element-ui -S
#安装依赖
npm install
# 安装SASS加载器
cnpm install sass-loader node-sass --save-dev
#启功测试
npm run dev

3、Npm命令解释：

npm install moduleName：安装模块到项目目录下
npm install -g moduleName：-g的意思是将模块安装到全局，具体安装到磁盘哪个位置要看npm config prefix的位置
npm install -save moduleName：–save的意思是将模块安装到项目目录下，并在package文件的dependencies节点写入依赖，-S为该命令的缩写