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项目的基本,接下来是继续对做项目的记录.顺序并不一定. 五.对页面入口文件的修改: 众所周知,main.js 程序入口文件,加载各种公共组件,App.Vue为 页面入口文件.但是有时候 ...

  7. Webpack+Vue构建项目

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

  8. Vue构建项目

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

  9. 【记录】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 出现这问题控制台会有一 ...

随机推荐

  1. think php 删除

    表单页面 <a href="/examtest/test/edit/id/{$v['id']}">修改</a> <a href="/exam ...

  2. JS-购物车

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. Android 12(S) 图形显示系统 - BufferQueue/BLASTBufferQueue之初识(六)

    题外话 你有没有听见,心里有一声咆哮,那一声咆哮,它好像在说:我就是要从后面追上去! 写文章真的好痛苦,特别是自己对这方面的知识也一知半解就更加痛苦了.这已经是这个系列的第六篇了,很多次都想放弃了,但 ...

  4. 被广泛使用的OAuth2.0的密码模式已经废了,放弃吧

    最近一直有同学在问,OAuth2密码模式为啥Spring Security还没有实现,就连新的Spring Authorization Server也没有这个玩意儿. 其实这里可以告诉大家,OAuth ...

  5. java的三大特性----封装、集成、多态

    当我们被问到你对java的封装.继承.多态是什么看法的时候,你会想到什么? 想到的会不会是封装就是将类的成员属性用privet修饰一下,达到私有化的目的,只暴露方法,从而达到成员变量私有化的目的. 而 ...

  6. linux指令_张三

    1.基础指令语法 ls (路径) 含义:列出当前工作目录下的所有文件/文件夹的名称 pwd(printworkingdirectory,打印当前工作目录) cd (路径)       作用:用于切换当 ...

  7. Source Code Reading for Vue 3: How does `hasChanged` work?

    Hey, guys! The next generation of Vue has released already. There are not only the brand new composi ...

  8. 6月27日 ajax

    AJAX准备知识:JSON 什么是 JSON ? JSON 指的是 JavaScript 对象表示法(JavaScript Object Notation) JSON 是轻量级的文本数据交换格式 JS ...

  9. mtu的原理和作用

    MTU: 最大传输单元,是指一种通信协议的某一层上面所能通过的最大数据包大小,最大传输单元这个参数通常与通信接口有关. 因为协议数据单元的包头和包尾的长度是固定的,MTU越大,则一个协议数据单元的承载 ...

  10. [XMAN筛选赛](web)ctf用户登录

    0x00 题目概述 就只写了几道web题,有些考察点比较明显,所以个人感觉来说web总体不难. 一航的writeup写得差不多,我这写个他没写的wirteup. 看题: 链接点进去是一个登录页面,习惯 ...