Java Web学习笔记22——前端工程化

作者 : admin 本文共794个字,预计阅读时间需要2分钟 发布时间: 2024-06-10 共4人阅读

 实际的前端开发:

Java Web学习笔记22——前端工程化插图

前端工程化:是指在企业级的前端项目开发中,把前端开发所需的工具、技术、流程、经验等进行规范化、标准化。

环境准备:

vue-cli:

介绍:vue-cli是Vue官方提供的一个脚手架,用于快速生成一个vue的工程化的项目模板

vue-cli提供了如下的功能:

统一的目录结构;

本地调试;

热部署:代码变动,不要运行,就能运行程序。

单元测试;

集成打包上线;

依赖环境Nodejs

特点:大大提高开发效率。

Nodejs:

安装Nodejs:是一个开源、跨平台的JavaScript运行环境。

http://node.js/en

Java Web学习笔记22——前端工程化插图(1)

我这边安装的是老师提供的版本: 

Java Web学习笔记22——前端工程化插图(2) 

Java Web学习笔记22——前端工程化插图(3)

 Java Web学习笔记22——前端工程化插图(4)

 选择的是默认路径。

 Java Web学习笔记22——前端工程化插图(5)

 Java Web学习笔记22——前端工程化插图(6)

没有勾选复选框。 

Java Web学习笔记22——前端工程化插图(7) 

Java Web学习笔记22——前端工程化插图(8)

 Java Web学习笔记22——前端工程化插图(9)

 验证Nodejs的环境变量:

Nodejs安装完毕之后,会自动配置好环境变量,我们验证是否安装成功,通过:node -v

Java Web学习笔记22——前端工程化插图(10)

配置npm的全局安装路径:

nodejs的包资源管理器:

1、使用管理员身份运行命令行,在命令行中,执行如下命令:

npm config set prefix "C:\Program Files
odejs"

 设置nodejs的安装目录。

2、切换到npm的淘宝镜像:

npm config set registry http://registry.npm.taobao.org

目的:主要加速资源下载。 

 

3、安装vue-cli:

使用管理员身份运行命令行,在命令行中,执行如下命令:

npm install -g @vue/cli

这个过程会联网下载,可能会耗时几分钟,耐心等待。

会有一个报错:

执行下如下命令:

npm config set strict-ssl false

禁用SSL:虽然不推荐,但您可以暂时禁用SSL验证来解决这个问题。但请注意,这会降低安全性。

Java Web学习笔记22——前端工程化插图(11)

Java Web学习笔记22——前端工程化插图(12) 

执行vue –version,看到版本,则说明安装成功了。

C:\Windows\System32>vue --version
@vue/cli 5.0.8

本站无任何商业行为
个人在线分享 » Java Web学习笔记22——前端工程化
E-->