1,按照官网安装步骤install

$ npm install -g vue-cli
$ vue init webpack my-project
$ cd my-project
$ npm install
$ npm run dev

2,生产部署(npm run build)时会遇到静态文件路径问题

解决如下:

3,背景图片引用地址问题

上面虽然解决了资源路径的引用问题,但是资源里面的背景图片,不像index.html中加载资源一样,通过./static/js/app.js引用可以正常加载,图片资源是通过css加载的,如 background: url("../../assets/images/logo-index.png") no-repeat;被相对打包后变成了url(static/img/logo-index.2f00bf2.png) no-repeat所以我们要保留css引用图片的正常路径,如下:

新增:publicPath:'../../'

3,使用element-ui、mint-ui时的注意

1,修改.babelrc文件后,出现Couldn't find preset "es2015" relative to directory问题错误

解决:npm install babel-preset-es2015 -S

文章摘选:https://www.cnblogs.com/moqiutao/p/7496718.html

webpack+vuecli问题记录

webpack+vuecli使用问题总结的更多相关文章

  1. webpack+vuecli打包生成资源相对引用路径与背景图片的正确引用

    资源相对引用路径 问题描述 一般情况下,通过webpack+vuecli默认打包的css.js等资源,路径都是绝对的. 但当部署到带有文件夹的项目中,这种绝对路径就会出现问题,因为把配置的static ...

  2. [Vuejs] webpack+vue-cli打包如何引用相对路径

    默认情况下通过webpack+vuec-li打包的css.js等资源,路径都是绝对的,即static在根目录下,假如部署到带有文件夹目录的项目中,资源路径就会出错,如何解决. 1.修改资源引用相对路径 ...

  3. webpack+vuecli打包常见的2个坑

    第一个坑: 一般情况下,通过webpack+vuecli默认打包的css.js等资源,路径都是绝对的.但当部署到带有文件夹的项目中,这种绝对路径就会出现问题,因为把配置的static文件夹当成了根路径 ...

  4. webpack vue-cli 一有空格和分号就报错

    webpack vue-cli 一有空格和分号就报错 eslintrc.js 这是ESLint的配置文件,至于为什么用ESLint的话,就是为了自动检查代码,保持一致的代码风格,从而保证代码质量. 这 ...

  5. vue之webpack+vuecli打包生成资源相对引用路径与背景图片的正确引用

    问题描述 一般情况下,通过webpack+vue-cli默认打包的css.js等资源,路径都是绝对的 但当部署到带有文件夹的项目中,这种绝对路径就会出现问题,因为把配置的static文件夹当成了根路径 ...

  6. [整理] webpack+vuecli打包生成资源相对引用路径与背景图片的正确引用

    webpack+vuecli打包生成资源相对引用路径与背景图片的正确引用 https://www.cnblogs.com/moqiutao/p/7496718.html

  7. webpack + vuecli多页面打包基于(vue-template-admin)修改

    转: webpack + vuecli多页面打包基于(vue-template-admin)修改 遇见的问题TypeError: Cannot read property 'tap' of undef ...

  8. 从零开始系列之vue全家桶(1)安装前期准备nodejs+cnpm+webpack+vue-cli+vue-router

    写在前面: 什么是全家桶? 包含了vue-router(http://router.vuejs.org),vuex(http://vuex.vuejs.org), vue-resource(https ...

  9. node+webpack+vue-cli

     安装nodejs + 安装webpack + 安装vue-cli+安装脚手架模板+安装依赖+运行 1 安装nodejs 去官网安装node.js( http://www.runoob.com/nod ...

随机推荐

  1. numpy数组的创建

    创建数组 创建ndarray 创建数组最简单的方法就是使用array函数.它接收一切序列型的对象(包括其他数组),然后产生一个新的含有传入数据的Numpy数组. array函数创建数组 import ...

  2. restful知识点之五解析器_响应器_分页器

    解析器 request.post:当数据时content-type urlencoded类型时才有数据 当content-type:是formdata时需要从request.body里取数据 requ ...

  3. jQuery的安装

    一.jQuery的安装 下载 jQuery 有两个版本的 jQuery 可供下载: Production version - 用于实际的网站中,已被精简和压缩. Development version ...

  4. MVC controller的Action获取HttpRequest

    HttpContext.ApplicationInstance.Context.Request

  5. Python学习---Django的基础学习

    django实现流程 Django学习框架:     #安装: pip3 install django          添加环境变量    #1  创建project       django-ad ...

  6. 沉淀再出发:java的文件读写

    沉淀再出发:java的文件读写 一.前言 对于java的文件读写是我们必须使用的一项基本技能,因此了解其中的原理,字节流和字符流的本质有着重要的意义. 二.java中的I/O操作 2.1.文件读写的本 ...

  7. Linux下打包压缩war、解压war包和jar命令

    情景:把project_a文件夹下的文件打包成project.war 1. 打包 jar -cvf project.war /project_a 说明: -c 创建war包 -v 显示过程信息 -f ...

  8. iOS自动化-iOS录屏xrecord及解决iPhone设备不显示的问题

    github地址:https://github.com/WPO-Foundation/xrecord 安装方法: git clone https://github.com/WPO-Foundation ...

  9. idea 2018激活注册码

    我使用的方法和pycharm激活类似,激活码不同而已pycharm激活步骤链接:可以新建标签打开https://www.cnblogs.com/-nbloser/p/8570648.html idea ...

  10. Spring MVC面试整理

    Spring MVC执行过程 客户端的请求提交到dispatcherServlet DispatcherServlet查询一个或者多个handlermapping ,找请求的Controller Di ...