1.node版本请更新到6.9.X版本以上,不然npm依赖会出问题

2.命令行里运行npm install --global vue-cli

3.npm install --global webpack

安装的时候报了:

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\webpack\node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.0.14: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

查了下是因为 fsevent是mac osx系统的,在win或者Linux下使用了 所以会有警告,忽略即可https://segmentfault.com/q/1010000004498934

4.到你想建项目的地方打开命令行, vue init webpack-simple 【my-project-name】里面有一些选项,一路回车就可以了

5.进入到文件夹里面 继续执行npm install

6.安装 vue 路由模块 vue-router 和网络请求模块 vue-resource

npm install vue-router vue-resource --save

还有一些别的模块:

npm install vuex --save
npm install style-loader --save-dev
:
npm install css-loader --save-dev
:
npm install file-loader --save-dev

7.npm run dev

浏览器弹出这样的页面就说明大功告成啦

vue构建项目全过程的更多相关文章

  1. vue 构建项目vue-cli

    1.首先得有node和npm的环境,node的下载:http://nodejs.org/download/.安装node之后,npm也自动生成了,显示版本号就意味着安装成功 2.接下来就是安装vue- ...

  2. vue 构建项目遇到的请求本地json问题

    在本地测试的json没有问题,但是打包后,发现json 的路径不对了,变成了绝对路径 解决方法: 建立的json文件需要放置  根目录/static下.如项目名/static/data.json,这边 ...

  3. vue 构建项目 文件引入

    1.vue引用依赖文件.  举例:axios 先安装 axios.如果直接安装 vue-axios 会报错 npm install axios npm install --save axios vue ...

  4. vue 构建项目遇到的问题

    1.我在打包完成后,打开index.html文件发现地址并没有携带路由. config下的 index.js 中的build命令的配置有一个属性叫assetsPublicPath,它的值为‘/’.意思 ...

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

    第一步: brew install nodejs(MAC机子下)  Windows直接官网下载对应版本node.js 第二步: 获取nodejs模块安装目录访问权限(Windows系统忽略)sudo ...

  6. Vue构建项目

    构建Vue项目 按照官网教程安装 //先安装脚手架 cnpm i -g vue-cli //查看项目目标列表: webpack browserify pwa 等项目模板 vue list //使用we ...

  7. 【记录】vue构建项目npm install错误run `npm audit fix` to fix them, or `npm audit` for details

    今天构建vue项目执行npm install初始化后报错 run `npm audit fix` to fix them, or `npm audit` for details 出现这问题控制台会有一 ...

  8. Webpack+Vue构建项目

    第一步:单纯的搭建出来我们的项目,并且通过webpack打包一个bundle.js然后运行起来 步骤: 1.建立项目必要的文件和文件夹(见截图) 2.配置webpack.develop.config. ...

  9. vue构建项目步骤

    1.node版本请更新到6.9.X版本以上,不然npm依赖会出问题 2.命令行里运行npm install --global vue-cli 3.npm install --global webpac ...

随机推荐

  1. transform顺序浅谈

    有用过transform的小伙伴们可能都会遇到一些问题,发现transform得到的结果往往不是我们所想的 例如scale(2,1) rotate(30deg) ,我们预想的结果是一个先放大的元素,然 ...

  2. 特征选取1-from sklearn.feature_selection import SelectKBest

    sklearn实战-乳腺癌细胞数据挖掘(博主亲自录制视频) https://study.163.com/course/introduction.htm?courseId=1005269003& ...

  3. parted分区工具用法

    parted分区工具用法 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 随着生产环境中数据量的增大,我们对硬盘的容量也有很大的需求,当硬盘的容量大于2T(工业上的最大磁盘2.2TB ...

  4. python---模板引擎

    布局文件layout.html:就是对文件的格式化输出(对其中的标签进行替换) <!DOCTYPE html> <html lang="en"> <h ...

  5. Linux最全vi命令

    1. 关于Vim vim是我最喜欢的编辑器,也是linux下第二强大的编辑器. 虽然emacs是公认的世界第一,我认为使用emacs并没有使用vi进行编辑来得高效. 如果是初学vi,运行一下vimtu ...

  6. web中的乱码处理

    1 .web中的中文乱码处理 1.页面设置pageEncoding="UTF-8" <%@ page contentType="text/html;charset= ...

  7. css3实现水平、垂直居中

    水平居中的方法: 1.父级text-align:center; .parent{ text-align: center; } .child{ display: inline-block; } 2.ta ...

  8. git回滚远程仓库代码/错提master分支的恢复

    前言 今天周五了,刚接了个新微服务模块,下班前高高兴兴开发完,提交git代码,jenkins发布到测试环境.突然看到一个提示 我最近提的代码呢?!! 想到可能会提错仓库,转念一想,不对呀,我怎有这么高 ...

  9. 【BZOJ4827】【HNOI2017】礼物

    强省HN弱省HA……(读作强省湖南弱省蛤 原题: 我的室友最近喜欢上了一个可爱的小女生.马上就要到她的生日了,他决定买一对情侣手 环,一个留给自己,一 个送给她.每个手环上各有 n 个装饰物,并且每个 ...

  10. Python装饰器实现异步回调

    def callback(func): def inner(obj, *args, **kwargs): res = func(obj, *args, **kwargs) if kwargs.get( ...