在使用vue开发项目时，如果要使用其单文件组件特性，必然要使用webpack或者其他打包工具打包，这里我用到的是webpack打包，首先是搭建vue环境和webpack环境，在这里遇到的一个问题是在成功搭建了vue环境之后，webpack环境基本上也搭好了，但是打包的时候，一直没有生成对应的dist文件夹，因为首次打包带的时候用的是npm run dev，所以在文件夹中并没有生成dist文件夹，因为run dev走的是dev-server.js，会启动webpack-dev-server，相应的代码会读进内存，不会在当前目录下产生dist文件夹。

所以首次打包的话想要生成dist文件夹，要使用webpack即可。

vue结合webpack打包问题的更多相关文章

  1. vue和webpack打包 项目相对路径修改

    一般vue使用webpack打包是整个工程的根目录,但是很多情况下都是把vue打包后的文件在某子目录下. 修改: 1,打开index.js assetsPublicPath:'/' 改为: asset ...

  2. vue之webpack打包工具的使用

    vue之webpack打包工具的使用 一.什么是webpack? webpack是一个模块打包工具.用vue项目来举例:浏览器它是只认识js,不认识vue的.而我们写的代码后缀大多是.vue的,在每个 ...

  3. vue 使用webpack打包后路径报错以及 alias 的使用

    一.vue 使用webpack打包后路径报错(两步解决) 1. config文件夹 ==> index.js ==> 把assetsPublicPath的 '/ '改为 './' 2. b ...

  4. vue通过webpack打包后怎么运行

    1. 成功使用webpack打包完成后会默认得到dist的文件夹 2. dist文件夹中有html与其他的静态文件 3. 在dist文件夹中打开命令窗口或者git,开一个服务器(像anywhere) ...

  5. vue项目 webpack打包后，图片路径是绝对路径

    vue项目,使用webpack打包,虽然在全局把路径改成了相对的路径,但是图片引用的路径还是异常的,解决办法如下: 1.config文件夹下index.js中: assetsPublicPath:&q ...

  6. vue的webpack打包

    一个完整的项目离不开 开发环境 生产环境 测试环境 这三个环境 首先解释一下这三个环境的含义 开发环境:开发环境是程序猿们专门用于开发的服务器,配置可以比较随意,为了开发调试方便,一般打开全部错误报告 ...

  7. vue项目webpack打包后修改配置文件

    从webpack打包结构中我们知道,vue中有一个存放外部资源的文件夹static,它里面的文件是不会被打包编译的,所以我们就可以利用外部引入js的方式将我们的想要的数据在index.html中以js ...

  8. 10. vue之webpack打包详解

    一.什么是webpack webpack官网给出的定义是 本质上,webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler).当 webpack 处理应 ...

  9. vue 之webpack打包工具的使用

    一.什么是webpack? webpack是一个模块打包工具.用vue项目来举例:浏览器它是只认识js,不认识vue的.而我们写的代码后缀大多是.vue的,在每个.vue文件中都可能html.js.c ...

随机推荐

  1. 小程序或者vue，解决菜单导航做做成轮播的样子

    案例: 其中最重要的思路就是如何让第二次或第三次以及后面的轮播有数据: 做法大致跟轮播图做法一样,只不过我们需要进行书写样式,代码如下: <!-- 做一个轮播图navbar demo --> ...

  2. 集合框架-ArrayList练习(去除ArrayList集合中的重复元素)

    1 package cn.itcast.p3.arraylist.test; 2 3 import java.util.ArrayList; 4 import java.util.Iterator; ...

  3. iPhone12和iPhone12pro的区别有什么？

    阅读全部 说法一 iPhone12和iPhone12pro的区别有:颜色.价格.运行内存.拍照.屏幕最高亮度.电池容量.材质.重量等,具体对比如下: 颜色:iPhone12五色可选,青春绚丽:iPho ...

  4. DBeaver下载安装与连接MySQL数据库

    一.Dbeaver下载 官网下载地址:Download | DBeaver Community 点击"Windows 64 bit (installer)"即可进行下载. 二.Db ...

  5. JavaScripts调用摄像头【MediaDevices.getUserMedia()】

    h5调用摄像头(允许自定义界面)[MediaDevices.getUserMedia()] <!DOCTYPE html> <html lang="en"> ...

  6. 如何在pyqt中实现丝滑滚动字幕

    滚动字幕的视觉效果 网上有很多博客介绍了滚动字幕的实现方法,懂得都懂,大部是 Ctrl C + Ctrl V,效果还很差,最后还是得靠自己.主要思路就是通过定时器定时刷新+绘制两段完整的字符串来达到 ...

  7. Android 使用签名的好处【转】

    感谢大佬:https://zhidao.baidu.com/question/360127490062917572.html 平时我们的程序可以在模拟器上安装并运行,是因为在应用程序开发期间,由于是以 ...

  8. 常用获取inflate的写法

    1.             //context:上下文, resource:要转换成view对象的layout的id, root:将layout用root(ViewGroup)包一层作为codify ...

  9. NSLog输出格式及随机数

    NSLog输出格式及随机数 %@ 对象 %d, %i 整数 (%i和%d无差别,%i是老式写法,%d是新式写法而已.) %u 无符整形 %f 浮点/双字 %x, %X 二进制整数 %o 八进制整数 % ...

  10. 按照递推的思想求解next[]数组

    按照递推的思想求解next[]数组 根据定义next[0]=-1,假设next[j]=k, 即P[0...k-1]==P[j-k,j-1] 若P[j]P[k],则有P[0..k]P[j-k,j],很显 ...