发表于: 2019-11-26 22:44:55
1 1132
今天完成的事
完成了Vue.js的安装配置脚手架
在安装组件的时候,出现了一些问题的还没有去解决把
收获:(通过今天的学习,学到了什么知识)
1、背景
主要介绍vue-cli搭建以及搭建过程中的问题
2、概念介绍
什么是nodejs:它的作用就相当于java中jvm一样,是一个运行时环境。什么是npm:nodejs平台上的包管理工具,卸载安装运行等都是通过它进行。什么是vuejs:vuejs一个前端框架,相当于java后台ssm框架一样。vuejs全家桶包括:vue-router:路由,vuex:状态管理, vue-resource:请求工具,再加上构建工具vue-cli,什么是webpack:可以看做是模块打包机:它做的事情是,分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并将其打包为合适的格式以供浏览器使用。
3、安装介绍
1)、vue的安装只需安装构建工具即可,其他的都会依赖安装,但是前提是需要安装node以及npm。命令:npm install --global vue-cli,这是全局安装的意思。如果安装成功会在C:\Users\用户\AppData\Roaming\npm,出现vue的运行工具。
安装过程报错信息:
解决方法:
1、 npm cache clean --force
2、 再执行 npm install 操作
2)、安装 webpack npm install --global webpack,安装成功后在npm目录下如下
4、vue-cli项目脚手架搭建
直接在项目文件目录下运行语句: vue init webpack 项目名称
示例如下:
5、项目文件目录结构分析
build:这里主要是放webpack的一些配置
conifg : vue项目的基本配置文件
node_modules : 项目中安装的依赖模块
src : 源码文件夹,基本上文件都应该放在这里
static : 生成好的文件会放在这个目录下。
test : 测试文件夹,测试都写在这里
.babelrc babel编译参数,vue开发需要babel编译
.editorconfig 看名字是编辑器配置文件,不晓得是哪款编辑器,没有使用过。
.gitignore 用来过滤一些版本控制的文件,比如node_modules文件夹
index.html 主页
package.json 项目文件,记载着一些命令和依赖还有简要的项目描述信息
明天的计划
开始看文档的内容和整理一下笔记
评论