# 用npmvue和docker打包你的应用程序 在现代的Web开发中,使用npmvue和docker来打包你的应用程序是非常常见的。npm是Node.js的包管理工具,vue是一个流行的JavaScript框架,docker是一个用于构建、发布和运行应用程序的开放平台。在本篇文章中,我们将讨论如何使用这些工具来打包你的应用程序。 ## npm npm是Node.js的包管理工具,它允许
原创 2024-05-30 06:43:00
40阅读
前端的组件都是基于 javascript 开发,然后用 node.js 打包,发布到 npm 的。所以我们要做组件发布,首先要了解 npm 包的开发与发布。npm 包的开发与发布项目初始化我们常常用 npm init 命令来初始化 node 项目;如果使用默认的设置,则可加入参数 -y。下面,我们新建一个 npm-components 文件夹,然后初始化项目:$ mkdir npm-compone
前言最近封装一个vue组件,手把手从0开始,最后发布到npm中。 插件如下 : npm地址链接功能效果如下:(左右联动菜单)你可以选择直接修改我的代码进行打包发布。git地址 1. 安装vue脚手架选择最基础的即可vue create lm-menu-scroll2. 整理文件代码删除src文件, 新增packages文件,同时建议把eslint关闭(vue.config.js中增加 lintOn
首先创建Vue项目vue init webpack <项目名称>进入交互1. 输入项目名称2. 项目描述3. 作者名称4. 选择vue的编译模式 默认选择第一种模式5. 选择是否安装vue的路由 6. 是否启用eslint 检测你的代码 7. 启用tests (用来做单元测试的)8. 启用e2e (用来做单元测试的)9. 选择用yarn 还是npm 来安装依赖&nb
jenkins+npm、maven打包+文件传输远程部署流程步骤一jenkins的安装jenkins服务启动访问jenkins页面步骤二npm的安装前端工程编译步骤三maven的安装maven配置注意项maven的使用步骤四结合jenkins进行自动部署1.jenkins配置2.以创建一个自由风格的软件项目为工程3.源码管理4.npm的构建5.maven的构建6.远程文件传输及shell执行7.
转载 2024-02-21 08:10:12
806阅读
1、项目创建首先我们要安装好vue,网上安装教程很多,这里就不就行介绍啦 下面我们就可以进行,我们的项目创建了 首先打开一个我们需要创建项目的目录在该目录下打开我们的cmdvue init webpack vue-demo1 #这里的vue-demo1就是我们所要创建的项目的名称剩下的就一直回车就可以了 等着创建完成就可以了 然后,我们cd进入到我们刚刚创建的工程目录中 在输入我们的运行命令npm
1.vue项目打包1.1 终端运行打包命令在编辑器的终端运行vue项目打包命令yarn run build打包成功如下:这时我们可以看到项目目录多出来一个dist文件夹,记住它,后面部署就靠它了。1.2 修改配置就我个人部署经历(宝塔面板快速部署)来说,这个配置是一定要修改的,如果不修改配置,直接将build后的dist包部署,运行后页面是空白的。修改配置要分两个处理方式(vue-cli2和vue
前端项目打包、Nginx的启动暂停、Nginx配置1、前端打包首先配置前端环境.env.preview文件中VUE_APP_API_BASE_URL指向后端地址之后,使用命令 yarn run build 打包后前端根目录出现dict文件夹yarn run build 或者 npm run build使用Nginx代理部署前端 -配置内容server { listen
转载 2024-06-10 10:23:27
1555阅读
npm install --registry=https://registry.npm.t
原创 2022-09-05 17:23:44
221阅读
前言平常使用Vue开发时,一个项目中多个地方需要用到的相同组件通常我们会封装为一个公共组件,但是如果项目不同我们也需要这个组件,那就需要复制一份公共组件代码到新项目,一个还好,如果是多个组件,这样就稍显麻烦了。 所以我们可以将封装好的组件打包发布至npm,就可以像element ui ant-design-vue这些ui组件库一样通过npm命令下载使用了一、准备需要封装vue组件,所以我们新建一个
1、一般打包 :直接 npm run build。(webpack的文件,根据不同的命令,执行不同的代码的)  注:这种打包的静态文件,只能放在web服务器中的根目录下才能运行。2、在服务器中 非根目录下 运行的 打包:需要配置  参考: 3、在本地文件系统中打开,不需要web服务器   暂时 不清楚4、使用 history模式 打包的 配置 : http:
工具:github、VScode、简述一下过程:1、新建一个username.github.io项目,github.io相当于是github提供了一个服务器2、新建一个博客项目docs,并且自动化部署到username.github.io项目中3、利用VuePress来构建博客docs4、利用github.io提供的https路径就可以打开你编写的文档下面动手开始吧1、在github上创建一个名为
转载 2024-10-31 15:51:30
12阅读
前言Vue项目一般用于实现前端的单页面富应用,其打包后的文件可简单看作静态文件,所以可以通过Nginx部署,当然也可以通过django部署(毕竟本质上还是一个html文件及各CSS,JS文件的集合)。不过前后端的耦合性以及性能就比nginx动静分离的差一点。但平时开发的时候可以这样部署,十分方便快捷。测试所使用框架版本 django 3.06,VueCli 3.0Vue打包修改vue.config
前言现在项目都是前后端分离的,所以前端要会部署前端项目。Nginx是一款轻量级的Web服务器、反向代理服务器,由于它的内存占用少,启动极快,高并发能力强,在互联网项目中广泛应用,所以我们的项目也使用Nginx部署打包项目首先,使用vue打包命令,打包部署的项目,生成dist文件夹备用:npmrunbuild服务器安装Nginx输入nginxv,看是否正确输出Nginx的版本号,如果可以正确输出
原创 2022-08-14 23:35:21
1046阅读
从三个插件开始1、CommonsChunkPlugincommonsChunkPlugin 是webpack中的代码提取插件,可以分析代码中的引用关系然后根据所需的配置进行代码的提取到指定的文件中,常用的用法可以归为四类:(1)、提取node_modules中的模块到一个文件中;(2)、提取 webpack 的runtime代码到指定文件中;(3)、提取入口文件所引用的公共模块到指定文件中;(4)
前端每次打包完成项目后都需要连接服务器上传到指定文件夹,这样子很繁琐也很浪费摸鱼的时间,所以我根据学到的打包钩子突然奇想,利用package.json文件执行的脚本完成打包并自动部署一体化,我的思路是打包完成后压缩文件夹然后上传至服务器目录进行解压替换,我可能不是第一个想到这种方法的,但也是根据自己的思想总结出来的,整体实现如下。 每次打包都会执行npm run build 这个命
1、项目时间长了,vue的node_modules依赖竟然到了16个G2、之前npm run build:prod都是可以的3、最新一次竟然失败了,说缺少模块。
原创 2023-12-20 09:27:12
904阅读
遇到的问题为vue项目webpack-dev-server配置后本地连接服务器地址正常请求,但是打包之后请求服务器接口一直是404;Vue前端打包:1.npm run build:prod 打包 2.npm run preview 打包正式环境预览.env.product(生产环境配置)文件,我这边是将接口地址也放到了里面VUE_APP_API_URLvue.config.js文件 反向代理及路由
第一步:在build/utils/webpack.prod.conf.js 中的output中添加一条 publicPath:’./’在build/utils/webpack.prod.conf.js 中的output中添加一条 publicPath:’./'如果有则继续往下走,come on!!! 没有的话看第二步 Vue-cli3.0文件配置Vue-cli3.0没有config文件,需要自己在
今天有时间分享一些平时自己开发上的一些构建配置,我们以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
  • 2
  • 3
  • 4
  • 5