Vue.js / webpack 没有创建构建文件?

2024-03-09

这可能是一个愚蠢的问题,但到底是什么?

我正在使用 vue-cliwebpack-simple模板,在该项目的 webpack 配置中我发现以下内容:

output: {
    path: path.resolve(__dirname, './dist'),
    publicPath: '/dist/',
    filename: 'build.js'
  },

但没有构建任何文件。当运行 webpack 服务器时,我可以通过浏览器访问该文件。是个build.js文件仅在 webpack 开发服务器运行时可用?

这就是定义runtime vs standalone?即使在查看了文档之后,我仍然很困惑确切的区别是什么。

我需要一个已编译的文件,因为我正在尝试发布一个转译文件以将我的包发布到 NPM。

Cheers.


Run

npm run build

这将创建一个/dist目录包含build.js.

您可以看到可运行的脚本package.json. The webpack-simple模板只有run and build。您需要复制index.html和 dist 文件夹。

当你开发时使用npm run dev您正在使用热模块重新加载,并且没有构建可通过热模块服务器使用的临时js。

如果您只想构建一个文件组件,您可以使用vue-cli's 构建命令 https://github.com/vuejs/vue-cli/blob/master/docs/build.md.

vue build Component.vue --prod --lib Component

where Component是单个文件组件的名称。这将生成一个仅包含您指定的组件的脚本文件。将该脚本包含在 HTML 中,并使用 `Vue.component("component", Component) 将其全局公开。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Vue.js / webpack 没有创建构建文件? 的相关文章

  • 无法在 typeScript 和 Webpack 中使用 p5.js

    我有一个使用图书馆的项目p5 js https github com processing p5 js Details 我的 Webpack 配置是 const path require path module exports entry
  • 如何使用 vue 观察对象数组中的特定属性

    我正在使用 vue js 2 5 2 我有一个对象数组 我想观察 forms selected 如果它发生变化 则调用一个函数 这是我的尝试 但显然这是不正确的 我尝试将数组放入 for 循环中以观察所选的每个对象的属性 watch for
  • 图片是在外部库中加载的,如何用webpack加载它们?

    首先 我需要说的是 我对 Webpack 的基础知识知之甚少 这可能就是我找不到解决方案的原因 所以我知道为了加载图像我需要一个路径而不是仅仅将其作为字符串输入require path to image 然后我得到了一个外部库 我需要在其中
  • Vue SPA - 如何在浏览器中呈现时隐藏 .vue 文件

    我正在开发一个用 Vue js 开发的单页应用程序 托管在 Node js 服务器上 目前它仍在开发中 但最终将暴露给外部客户 并且由于我们将处理敏感数据 我们希望避免在用户检查元素时看到 vue 文件和相对文件树结构在开发工具中 See
  • 实现npm包自定义组件VueJS

    我正在尝试使用以下 npm package 来绕过 X frame 选项 https www npmjs com package x frame bypass https www npmjs com package x frame bypa
  • 从字符串变量导入模块

    我需要从内存变量导入 JavaScript 模块 我知道这可以使用SystemJS and Webpack 但我找不到一个好的工作示例或文档 文档主要讨论 js 文件的动态导入 基本上我需要像下面这样导入模块 let moduleData
  • 如何销毁/卸载 vue.js 3 组件?

    我有一个相当大的vue js 2具有动态选项卡机制的应用程序 用户可以与应用程序打开和关闭选项卡进行交互 每个选项卡代表一条路线 为了实现这一点 我使用 vue router 并保持活动状态 如下例所示
  • 从在不同端口运行的 Vue 应用程序调用 Node Express 服务器 API

    我最近开始学习 vue js 并且目前使用 vue jsvue 简单 webpack https github com vuejs templates webpack simpletemplate express 和 mongo 来开发一个
  • 压缩 webpack 插件

    我正在尝试弄清楚如何正确使用webpack html 插件与压缩插件 后者的文档有点匮乏 我的 webpack 配置声明 output filename js name hash js 最后运行压缩插件 new CompressionPlu
  • ES6 在defineAsyncComponent 中命名导入

    我想异步加载我的网络应用程序的一些元素 这是旧的导入 import Popover PopoverButton PopoverPanel from headlessui vue export default components Popov
  • 在 vuejs 上将 \n 替换为新行

    我正在尝试将 n 字符替换为来自端点的数据的新行 I tried p item licensedocument legal documentText replace r n r n g br p 并没有奏效 当我将replace 写入问题末
  • Cytoscape 布局 - 处理锁定节点

    我正在使用 vue cytoscape 渲染图形并浏览树状数据结构 我的目标是扩展父节点并保持它们在图中的位置 我想简单地添加新的子节点 我的方法是锁定当前节点 添加子节点并解锁节点 this cy nodes lock for let d
  • 如何在vuetify中设置固定工具栏?

    在 vuetify 中我使用工具栏
  • 在 Vue 3 的生产构建过程中从 Vue 模板中删除所有数据测试属性

    我在 TS 中使用 Vue3 最后一个 vue cli 我想在 vue loader 编译 vue 文件时获取所有节点 vnodes 元素 我需要读取节点属性并删除所有 数据测试 我尝试在 vue config js 中使用 module
  • 在上传之前预览图像 VUEjs [重复]

    这个问题在这里已经有答案了 我知道这个问题已经被问过 但我不知道如何在vuejs中使用代码 我尝试了很多但没有任何结果 我还添加了我的代码 有人可以帮帮我吗 这是我的代码 谢谢 html
  • 如何在 Vuejs 中加载 Pixi 实例?

    我正在 VueJS 组件中学习 PixiJS 如下所示Pixi教程 https github com kittykatattack learningPixi我控制台显示此错误 vue runtime esm js 2b0e 619 Vue
  • 如何封装Vuejs项目中的常用功能?最佳实践

    我正在开发一个使用 Vuejs 作为前端的中型项目 我正在探索的封装 分离可能在许多组件中使用的常用方法的选项包括 mixins 方法和插件方法 混合方法我必须在每个要使用 mixin 方法的组件 文件 中编写一条 import 语句 由于
  • vuejs中如何获取组件编译后的html内容

    我有一个这样的组件
  • nuxt.js - 如何在服务器端为所有客户端缓存 axios 调用

    我正在使用 vue nuxt js 应用程序 我想知道是否可以为所有客户端缓存 axios webservice 调用 我必须获取一些货币参考数据 而每个客户都必须调用这些数据并没有多大意义 有人可以给我一些提示 甚至是一个例子吗 谢谢 这
  • 如何减少 WEBPACK + VUEJS 中的包大小

    我遵循了很多有关如何减小捆绑包大小的教程 但没有任何内容对捆绑包大小产生任何影响 我不知道为什么 每次当我向 webpack 添加一些新代码时 我的包大小都保持与以前相同 我的应用程序是使用 vue cli 3 pwa 插件 webpack

随机推荐

  • 如何在sql中找到运行序列的峰值和谷值

    我在 athena 中有一个数据集 因此出于此目的 您可以将其视为 postgres 数据库 数据样本可以在这里看到sql小提琴 http www sqlfiddle com 17 4b3732 2 这是一个示例 create table
  • 布局 xml 文档中的 Android“tools”命名空间

    根据这里的问题 Android 布局文件中的 tools context 是什么 https stackoverflow com questions 11078487 android whats toolscontext in layout
  • Ti-Calculator 上的多语言编程

    我对在 Ti 84 plus 计算器上使用除 Ti Basic 之外的不同语言 如 Java C 和 Python 进行编程感兴趣 我的计算器是否支持此功能 如果不支持 市场上是否有任何计算器可以执行此操作 提前致谢 这个想法是 当我在家无
  • NSTimer 计时器WithTimeInterval:不工作

    在我的项目中实现之前 我已经创建了一个带有计时器的测试应用程序 这是我第一次使用计时器 但问题是当我使用计时器实现时 NSTimer timerWithTimeInterval target selector userInfo repeat
  • git 仓库中 Composer 包冲突;如何在推送到远程时取消跟踪文件但避免删除文件

    我通过 Composer 在我的 Web 应用程序上安装了一个包 并将包文件夹添加到 gitignore 同时提交composer json and composer lock 为了部署到我们的服务器 我们推送到服务器上的裸 Git 远程服
  • 如何延迟 AngularJS 即时搜索?

    我有一个似乎无法解决的性能问题 我有一个即时搜索 但它有点滞后 因为它开始搜索每个keyup JS var App angular module App App controller DisplayController function s
  • C++中高效比较字符串的方法

    像这样将一个字符串与另一个字符串或字符串文字进行比较是否有效 string a string b if a test or if a b 我的同事让我使用 memcmp 对此有何评论 Thanks Yes use a b 不要听你的同事的话
  • 如何在 Docker Compose 中初始化 MySql 数据库

    设想 我在 Spring 中开发了一个微服务 它使用 mysql 8 数据库 该数据库必须初始化 创建数据库 一些表和数据 在我的主机上 我使用 data sql 和 schema sql 脚本初始化了数据库 问题是 我必须设置 sprin
  • 在表单之间传递数据

    我有两种形式 第一的 Form1有一个组框 一些标签和一个列表框 我按下一个按钮 然后新的Form2打开并包含一些文本 我想将文本传输到Form2到列表框中Form1 到目前为止 我所做的是将列表框的修饰符设置为public然后将此代码放入
  • 如何从视图访问 django 模型属性?

    我有一个 Django 模型 class DebtRequest models Model from user models ForeignKey User related name debt requests from user to u
  • 从资源文件夹或SD卡访问文件有什么区别

    我正在开发一个应用程序 我必须使用三种不同大小的文件 1mb 5mb 15mb 我搜索了一下 然后知道我们可以将这些视频保存在资产文件夹中并可以使用这些视频 其次 我了解到我们可以将这些视频保存在资产文件夹中 并且安装时我们可以将所有视频移
  • Android 将 ParseObject 发送到另一个 Activity

    我有一个 ParseObject 我想发送到另一个活动 public class HWMMatch extends ParseObject implements Serializable public HWMMatch public Par
  • 查找数组中是否缺少元素的复杂性

    我正在尝试编写一个函数 用 C 语言 来检查数组是否包含所有元素 0 和 size 1 之间 例如 如果数组的大小为 3 则它应该具有 0 1 2 以任何顺序 问题是 在没有额外数组的情况下执行此操作的最有效的复杂性是多少 我的尝试的复杂性
  • 与 char *、unsigned char * 和signed char * 别名

    A char 和合格的变体 可以为任何东西起别名 是signed char and unsigned char 及其合格的变体 不受此限制 换句话说 我了解到申请是个好主意restrict to char 函数参数 如果我不希望它们为其他类
  • GWT - 构造 Java AST 时出错

    编译过程中可能是什么原因导致此错误 我已经从这个原型生成了项目https github com ArcBees Arcbees Archetypes https github com ArcBees Arcbees Archetypes我只
  • OpenGL ES 和 OpenGL 兼容着色器

    我想要 OpenGL ES 和 OpenGL Windows 具有相同的着色器源 为此 我想定义自定义数据类型并仅使用 OpenGL ES 函数 一种方法是定义 define highp define mediump define lowp
  • JavaFX 8 计算“textarea”中的行数

    我们正在尝试计算 TextArea 中的行数以下是 TextArea 属性 PrefWidth 600 和 PrefHeight 620 以及 MaxHeight 620文本换行设置为 true 我们将 JavaFX 8 与场景生成器一起使
  • 小时显示 hourSegments 角度日历

    在我的日历中 我需要显示一天和一周的时间 如下所示 09 00 09 15 09 20 我把包升级到最新了 angular calendar version 0 26 1 现在下面的代码出现错误 我无法再像以前一样显示时间 模块 ts cl
  • 复制并粘贴值而不是公式

    第一次编写宏 我必须仅将单元格值复制到另一个单元格值 并且我让它工作 但是 我不确定如何在不指定范围的情况下复制整个列 因为范围每次可能不同 在这里 我尝试使用一个有效的范围 但我希望它检查该列的单元格值 直到找到值复制 粘贴到另一列 这是
  • Vue.js / webpack 没有创建构建文件?

    这可能是一个愚蠢的问题 但到底是什么 我正在使用 vue cliwebpack simple模板 在该项目的 webpack 配置中我发现以下内容 output path path resolve dirname dist publicPa