码迷,mamicode.com
首页 > 其他好文 > 详细

关于vue构建项目的一些指令

时间:2017-10-04 12:46:59      阅读:154      评论:0      收藏:0      [点我收藏+]

标签:忽略   更新   app   成功   创建   npm   vue   空格   brew   

第一步:

brew install nodejs(MAC机子下)  Windows直接官网下载对应版本node.js

第二步:

获取nodejs模块安装目录访问权限(Windows系统忽略)
sudo chmod -R 777 /usr/local/lib/node_modules/

第三步:

npm install -g cnpm --registry= https://registry.npm.taobao.org(安装淘宝镜像/或者使用自己公司代理)

第四步:

安装webpack
cnpm install webpack -g(全局安装打包机)

第五步:

安装vue脚手架
npm install vue-cli -g

第六步:

在硬盘上找一个文件夹放工程用的,在终端中进入该目录
Mac
cd 目录路径
根据模板创建项目
vue init webpack-simple 项目名字            <注意不能用中文!!!>
或者创建 vue1.0 的项目(可忽略因为现在基本是2.0猜想后面是随着迭代升级)
vue init webpack-simple#1.0 项目名字     <注意不能用中文!!!>

第八步:

安装项目依赖
一定要从官方仓库安装,npm 服务器在国外所以这一步安装速度会很慢。
npm install
(不要从国内镜像cnpm安装,会导致后面缺了很多依赖库,其实这个还是按照实际项目来一般也是可以的。)
cnpm install
安装 vue 路由模块 vue-router 和网络请求模块 vue-resource
cnpm install vue-router  vue-resource --save(安装模块一般是中间空格隔开,)
启动项目
npm run dev/cnpm run dev

注意安装模块依赖:

cnpm install 模块名 --save-dev(关于环境的,表现为npm run dev 启动不了)
cnpm install 模块名 --save(关于项目的,比如main.js,表现为npm run dev 成功之后控制台报错)

注意:npm update vue-cli更新脚手架的版本命令和 npm update -g 更新npm版本(主要是防止低版本有时候构建项目会报错的解决方法一般也有提示)

构建好的项目骨架一般最重要的就是开发部分src下的目录,组件基本放这里面或者自己取文件夹名字也是可以的。

记住:

App.vue // 页面入口文件
main.js // 程序入口文件,加载各种公共组件
index.html // 入口页面

router下面的index.js是配置路由信息的。(单页面的title也可以这里配置

关于webpack的就自行官网API。。。谢谢!

 

关于vue构建项目的一些指令

标签:忽略   更新   app   成功   创建   npm   vue   空格   brew   

原文地址:http://www.cnblogs.com/lhl66/p/7624911.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!