vue 学习笔记1——初始化及基本的安装和操作

vue 学习笔记1——初始化及基本的安装和操作

1.自己引入vue.js，直接用vue和ES6语法，可以引入JQ，来使用

预装环境 node和npm 可以挂淘宝镜像

全局安装vue-cli

npm i -g vue-cli

创建webpack项目，便于打包

vue init webpack vue-text(项目名称一定要为中文)

cd vue-text 进入项目目录

npm install 下载依赖关系

其他的插件或是依赖关系，根据自己和项目的需要，down

再使用npm run dev 来热加载我们的应用

且运行服务器，我们在localhost:8080即可查看我们的应用

一般在浏览器中查看的时候，当前状态是和官网上面的Hello Vue的页面一样

在安装其他插件的时候
请注意package-lock.json的文件
建议优先删除它之后再进行其他安装包和依赖的下载安装

之后他会自己重新生成

注意webpack.base.conf.js的配置文件

1.webpack.base.conf.js中

1.1在调试的时候，不建议修改其中的输入文件的publicPath的初始配置，网上有些帖子是直接修改，可能是因为年代久远的原因，但是我不建议，不建议！现在有的vue-cli，在此处为一个三目判断，run dev和run build的时候，是走的两条线了。

1.2根据提示，进入config文件夹中的index.js文件

build中定义npm run build时候的相关参数
此时我们只看两个设置
assetsSubDirectory: ‘static’, //设置build后的初始引入文件夹（我是这么理解的）
assetsPublicPath: ‘./’, //设置公共路径（默认的是/ 现在改为 ./ 为相对路径，我是这么理解的）

打包的时候，npm run build的时候，注意要修改成’./’ 记住

这是将输出文件的路径修改成相对当前的路径

build，之后就就可在dist文件夹中的index.html就可以打开正常了

关于npm run build之后的相关问题，会在后续的文章中设置，此处只是最简单的介绍，在dev和build的时候都能显示基础的页面。

vue学习笔记，是根据网上的一些帖子，自己在学习过程中实际情况，总结而来。每个人在学习过程中和实际操作中是有明显的个体差异的。本文仅作参考使用。