自学vue基础,搭建vue项目,小总结

node.js环境(npm包管理器)
vue-cli 脚手架构建工具
cnpm npm的淘宝镜像
--save-dev 是你开发时依赖的东西 , --save 是你发布之后还依赖的东西


一、下载安装node.js

网上免费下载,不熟悉可以下载完成后傻瓜式next安装
安装完成后打开终端dos命令node -v检查


二、部署运行vue项目

一般node.js有自带的npm最好还是更新一下,终端dos命令npm install
安装cnpm在命令行中输入 npm install -g cnpm --registry=http://registry.npm.taobao.org 然后等待,安装完成
安装vue-cli脚手架构建工具,在命令行中运行命令 cnpm install -g vue-cli ,然后等待安装完成。
在命令行中cd/ 回到根目录,再cd进入到要建项目的目录。
在命令行中运行命令 vue init webpack firstVue初始化项目。
在命令行中cd firstVue 项目文件去。
在命令行中运行命令

npm install vue-resource --save


在命令行中运行命令

npm install jquery@3 --save


在命令行中运行命令

npm install less less-loader --save


在命令行中运行命令

npm install bootstrap@3 --save


然后运行命令 cnpm install ,等待安装。
完场上面项目后,项目目录firstVue文件夹中多出一个node_modules文件夹
安装完毕后,在main.js中导入vue-resource
在build/webpack.base.conf.js文件中,在整个 module.exports 配置对象的末尾增加plugins配置jquery
在src/main.js文件的顶部加入如下对bootstrap主要文件的引用


三、实现vue多页面开发

创建创建一个目录,新建三个文件:new.html,new.js,new.vue
build\webpack.base.conf.js在module.exports中,找到entry添加多个入口one.js
打开\build\webpack.dev.conf.js文件,找到plugins,添加配置
打开\config\index.js文件,在build里加入配置
打开/build/webpack.prod.conf.js文件,找到plugins,添加配置
写new.js
写new.vue
写new.html

猜你喜欢

转载自www.cnblogs.com/duofla/p/10072803.html