使用vue-cli2.x脚手架为每个vue项目创建脚手架项目结构，项目结构目录中每个文件夹介绍如下：1、build 文件夹里面是对 webpack 开发和打包的相关设置，包括入口文件，输出文件，使用的模块等。 1.1 webpack.base.conf.js ：打包的核心配置 1.2 build.js：构建生产版本，项目开发完成之后，通过build.js打包（加载base与prod，读取完之后
转载
2024-05-17 21:33:32
223阅读
步骤一：你已经按照好vue文件了，可以成功运行项目，如没有按照vue，可以参照我前面的文章，那里面有详细的步骤 进到你的文件中，就会出现这些： 1.build：主要用来配置构建项目以及webpack2.config：项目开发配置3.npm或者cnpm所下载的依赖包4.你的源代码5.静态文件夹，webpack打包时不会打包这里文件6.最外层的页面一般title等都设置在这里7.存
转载
2023-10-12 11:30:17
370阅读
Vue 打包后，如果想修改整体的后台接口域名，或者图片文件的路径，就需要在源代码中修改后，再次进行build打包。这样很不灵活，先看一下vue打包后的文件结构：项目打包后会生成一个dist文件夹dist中有一个存放外部资源的static，它里面的文件是不会被打包编译的， 所以我们就可以利用外部引入js的方式将我们的想要的数据在index.html中以js文件的方式引入，也就是将图中的config.
转载
2024-03-23 10:02:27
425阅读
运行 npm run build命令打包之后发现多了很多.map文件，占体积最大 搜索之后发现 map文件的作用：项目打包后，代码都是经过压缩加密的，如果运行时报错，输出的错误信息无法准确得知是哪里的代码报错。 有了map就可以像未加密的代码一样，准确的输出是哪一行哪一列有错。 解决办法：去conf
原创
2022-08-01 10:30:14
673阅读
1、打包后的文件和路径在哪里看在控制台 element和sources里看 我们自己公司是这样的 控制台这个 sources 可以看到资源目录。如下图所示 这些资源都相当于在线资源了，可通过右击在新标签页打开（如下图所示）。 这里的liangwei相当于dist目录。然后再去找liangwei下的static等资源文件。 在element可以发现，这个红框的就是自己写的js代码，因为有static
转载
2024-07-16 14:28:19
1287阅读
# Vue打包后的文件如何运行 Yarn
在前端开发中，Vue.js 是一种流行的框架，用于构建用户界面。当我们完成开发后，通常会将项目进行打包，以便优化和部署。在这篇文章中，我们将探讨如何使用 Yarn 在本地运行 Vue 打包后的文件，并解决实际的问题。
## 前提条件
要完成任务，首先确保以下工具已经安装：
1. Node.js - 用于运行 JavaScript。
2. Yarn -
今天有时间分享一些平时自己开发上的一些构建配置，我们以Vue-CLI-2.x来构建开发环境。 好，我们先来看一下我们要做哪些工作。 现附上源码地址，https://github.com/749264345/Vue-CLI-2.x1.Vue,Vuex,vue-router,axios通过CDN引入；优化打包后文件过大的问题 2.开发环境区分开发，测试，生产；提高开发效率 3.打包区分测试与生产 4.
转载
2024-01-05 22:30:22
160阅读
一、前期准备1.首先，需要安装nodejs，版本需要与其它同事的保持一致，否则可能出现打包报错的情况； 安装msi格式的nodejs，就可以不用手动配置环境变量。2.如果有必要，修改npm下载源为公司内网源（如果允许访问外网，可以找cnpm使用淘宝源的方法）npm config set registry http://www.xxx.com/group
npm config get regist
转载
2023-11-25 21:05:16
88阅读
一、chunk-vendors.js 简介顾名思义，chunk-vendors.js 是捆绑所有不是自己的模块，而是来自其他方的模块的捆绑包，它们称为第三方模块或供应商模块。通常，它意味着（仅和）来自项目 /node_modules 目录的所有模块，会将所有 /node_modules 中的第三方包打包到 chunk-vendors.js 中。将所有的第三方包集中到一个文件，自然也会出现文件过大的
在使用 Vue.js 开发前端项目时，很多情况下我们可能需要引入 jQuery 作为第三方库来处理某些 DOM 操作或者调用一些不支持 Vue.js 的第三方插件。然而，当我们将 Vue 项目打包后，可能会遇到 jQuery 相关的问题，比如 jQuery 的冲突、无法正确加载等。接下来，我们将详细探讨如何解决这些问题，并包括一些实用的技巧和优化方案。
## 环境配置
在解决 Vue 打包后
耽误了几天, 终于开始写第二篇博客了, 这篇会讲怎么将vue项目打包部署到服务器, 其实和上一篇的uni-app步骤一样的, 就是最后多了一步修改nginx配置, 好 , 上操作一 ,打包项目vscode下载链接：https://pan.baidu.com/s/1ibHt7XB6EZy37BDb1CigWw 提取码：69r11 , vscode打开你的vue项目 – > 点终端 - >
转载
2023-11-11 20:07:15
208阅读
vue项目打包部署流程一、打包二、部署三、部署多个项目 一、打包（可选）去除打包后会生成的map文件：在vue.config.js中添加productionSourceMap: false,map文件作用：项目打包后，代码都是经过压缩加密的，如果运行时报错，输出的错误信息无法准确得知是哪里的代码报错。map文件可以准确输出报错位置。项目终端运行npm run build，出现的dist文件即为打
转载
2023-09-05 11:09:07
229阅读
路径：/config/index.js是否产生map文件，置为false.
转载
2022-05-26 12:25:34
340阅读
报错如下：Refused to apply style from 'http://127.0.0.1:5500/css/chunk-43aa77e1.33bcbef1.css' because its MIME type ('text/html') is
not a supported stylesheet MIME type, and strict MIME checking is enabl
转载
2021-04-04 22:07:54
3881阅读
2评论
本教程是针对vue-cli3以上的版本，其实原理都大同小异，这个demo为vue-cli直接创建的项目，并在main.js中引入了echart、element-ui、lodash首先看demo打包后生成的文件大小，这个demo里面什么业务都没写、仅仅引入了几个包，chunk-vendors.js就达到了1.6M之多，如果是写入了庞大的业务后没做任何优化处理，那么这个文件可能会达到10M之多，这发生
转载
2024-10-18 09:43:44
16阅读
在打包之前需要修改一个地方，那就是config->index.js文件，修改assetsPublicPath: '/'为assetsPublicPath: './',截图如下上面文件改好后，开始打包，执行如下命令： npm run build 生成 dist 文件夹1.使用 cordova 打包 （较为复杂，安全，需要配置环境） 第一步：安装cordova如果已经安装则直接跳过
转载
2024-04-15 14:53:29
0阅读
为何会写这篇文章呢？因为打包部署太麻烦 大家都知道，vue-cli项目配置后台服务地址的位置在config目录下的文件中配置，初学时觉得很方便。 真正应用到项目之后，会发现我们不只有开发环境，还有测试环境、生成环境等等，如果打包部署的话，我们需要分别为每个环境打一次包，很繁琐！ 项目前期还可以接受这种方式，因为主要是本地开发，到了项目后期进行bug修复和优化阶段，打包部署变得比较频繁
转载
2024-05-28 09:57:20
159阅读
server { # 监听的端口号 listen 3988; # 服务名称 改成自己服务器的地址 server_name 127.0.0.1; # vuejs静态文件配置 location / { # 静态文件的位置 root /srv/aiPowerWeb/; # hash 模式下，找不到路径就切
原创
2021-10-22 11:03:51
646阅读
方案一：利用electron直接打包项目暂未成功，打包完exe会报错 打包方式：（1）DOS窗口命令打包 DOS 下，输入 npm install electron-packager -g全局安装我们的打包神器：cnpm install electron-packager -g（2）在项目文件夹下面，也就是根目录下面打开DOS执行打包命令：electron-packager . HelloWorl
转载
2024-02-29 21:43:44
141阅读
操作的流程大概是：首先，在本地编辑器中创建一个可运行可打包的完整的项目，然后将其放到代码托管的远程仓库中。其次，在nginx的配置文件中更改相关的配置信息（项目的端口信息，以及项目入口文件的地址等）。最后，在jenkins里安装git插件，并且通过webHooks与远程仓库建立连接，最终在代码提交时触发自动构建项目，并且在项目的nginx部署地址可以访问到。一、开发工具和版本管理工具这里介绍vue
