问题标签 [vue-cli-4]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - 赛普拉斯测试因断言等于 DOM 标题而失败
处理使用Vue CLI Electron Plugin Builder创建的@vue/cli 4.2.2项目。Vue CLI 使用目录中自动生成的HtmlWebpackPlugin。相关页面的 具有自动从文件中检测页面标题的语法。index.htmlpublic</title>index.html<%= htmlWebpackPlugin.options.title %>vue.config.js
vue.config.js
问题是，当应用程序启动时，页面标题从stackoverflow变为Stack Overflow会有一个毫秒的闪烁。为了防止这种情况，我使用了page-title-updated如下所示的 Electron 钩子来确保应用程序标题正确加载。
main.js
它工作得很好，现在没有窗口闪烁，</title>但是当使用 Cypress 运行e2e测试时，它只是找不到正确的标题Stack Overflow并且测试失败。
test.js
赛普拉斯测试的结果expected stackoverflow to equal Stack Overflow。所以，百万美元的问题是，我如何获得赛普拉斯测试通过？
vue.js - 在 Mac 上将 vue 与 Chrome 一起使用时未触发 keyup 事件
这最近在我的项目中开始发生，所以我使用 vue cli 2 创建了一个新项目。我没有添加任何其他内容
在 App.vue 中，我在挂载函数中添加了 3 个事件侦听器。
上面的代码打印了 Firefox 和 Safari 上的所有事件，但不是 chrome。它也适用于 chrome incognito，但不适用于正常模式。
这也只发生在mac机器上。
这也仅在我使用 vue 时发生
如果我创建一个独立的 html 文件，代码将返回所有 3 个事件。
任何调试想法也值得赞赏。
javascript - 即使我更改路线，Vue 方法也会运行，仅当我在特定路线/组件上时如何运行方法？
我正在从 Wordpress API 检索帖子，并且在滚动时我想加载更多帖子并且它可以工作。但是，每当我在底部滚动时单击帖子以打开另一条路线时，应用程序都会调用 API，它基本上会scroll()从其他组件运行该方法。我正在使用 vue-router 和 axios。
家庭组件：
单个帖子组件：
firebase - npm run build on Vue 项目将 base_url 填充为未定义
我昨天在 vue/cli github 错误页面上发布了我的环境详细信息。看起来所有错误都没有得到响应，所以我希望你们能帮助我。
短版：
我有一个 Vue/Firebase 项目。我正在尝试构建它，以便可以在 Firebase 上部署它。当我通过 Vue UI 提供该项目时，该项目运行良好。当我运行npm run build时，创建的 /dist/index.html 文件的 href 都以“/undefined/...”开头。显然，当我将它部署到 Firebase 时，这不起作用，给我这样的错误Uncaught SyntaxError: Unexpected token '<'
可疑的事情：
- 部署到 Firebase 后，它仍然能够找到我的 favicon.ico，即使它认为它位于
https://myproject.firebaseapp.com/undefined/favicon.ico. - 在我的环境信息中，我有
npmGlobalPackages: @vue/cli: Not Found. 我尝试的步骤在上述 GitHub 页面的评论中，但我无法更改。 - 在我的环境信息中，它说
Browsers: Edge: 44.18362.449.0. 我不知道这是否重要，但我只是在 Chrome 中工作和测试。
我尝试过的事情
根据许多 stackoverflow 的答案，我可以
Try by adding <base href="/" /> into the <head> of your index.html. Hope it will work., 和You might have used "./" prefix for Relative path in src attributes of your index.html, Just replace it with "<%= BASE_URL %>" and it will work fine.. 我都试过了，还是不行（我也试过提问者的npm install再次跑步的建议）。除了我所说的更改之外，我还有生成的 firebase index.html 文件。根据许多其他问题，这
Unexpected token '<'可能是 Firebase 的缓存问题。他们说我可以尝试硬刷新（我尝试过）或清除缓存（我也尝试过）。我什至尝试使用完全不同的计算机，但仍然遇到相同的错误。老实说，我不认为是这样，因为我不认为我的 dist/index.html 文件应该在其中未定义，这是在我将其上传到 Firebase 之前。
代码： vue.config.js
公共/index.html
dist/index.html
jquery - TypeError: c(...)(...).modal 不是构建 vue-cli 项目后的函数
我是 vuejs 的新手。我正在使用 vue-cli 在 vue 项目中工作
- 我安装了 vue vue/cli
npm install -g @vue/cli - 我创建了一个项目
vue init webpack my-project - 我安装了 jQuery
npm install jquery - 我安装了materialize-css
npm install materialize-css - 之后一切都很好
npm run dev - 但是当我这样做
npm run buid并运行 dist 目录中的 index.html 文件时，我在 chrome devtools 中收到此错误
我的 main.js
我的应用程序.vue
我怎样才能解决这个问题 ？
vue.js - Eslint 检测到格式错误，但在保存时没有修复它们（Vue/cli 4.2），尽管 'lintOnSave: true'
我最近使用 Vue/cli 4.2 创建了一个项目。问题是 Eslint 检测到格式错误（例如脚本中的双引号，函数括号之间没有空格），但在保存时没有修复它们，尽管lintOnSave: true在vue.config.js. 它应该是默认值，但如果我没有说明这个设置，eslint 会破坏编译并抛出格式错误。如果我包含lintOnSave: true，则执行编译并且错误仅在代码中标记并在终端中列出。唯一修复的错误是尾随空格，但这可能是由.editorconfig设置引起的。
我正在研究 VS 代码。我禁用了“formatOnSave”选项（否则 VS Code 应用它自己的设置）。我不认为这是 VS Code 设置的错误，因为如果我处理一些使用 vue-cli 3.7 创建的旧项目 - 它们工作正常并且自动格式化正确执行。我比较了设置，它们基本相同（lintOnSave: true旧版本中不需要的除外）。
我怎样才能解决这个问题？
这是我的设置——它们可能有点乱，因为我进行了很多试错：
1) *** .eslintrc.js
2) *** vue.config.js
3) *** .editorconfig
4）***包.json
我会很感激任何提示如何解决缺少自动格式化的问题。
vue-cli-4 - Vue 给我一个关于未提交更改的警告
所以我刚刚用 vuecli 创建了一个新的 vue 项目。我玩了一下，然后想使用vue add <plugin>. 现在我收到以下警告：
当前存储库中有未提交的更改，建议先提交或存储它们。
那是怎么回事？为什么此错误消息使用此特定术语？我没有使用任何版本控制系统，因为我只是在玩玩，即使我会 - 这个警告仍然会让我感到困惑。vue-cli 是否使用某种内部版本控制系统？
windows - 在 Windows 上更改 vue cli 创建路径位置
我刚刚开始使用 Vue.js，我似乎遇到了一个奇怪的问题，我可以使用一些帮助。当我使用 CLI 创建一个新项目时，它会在我的文件夹的根目录中创建新的项目文件user夹。这只是一个糟糕的做法。我不介意将它们放入vue-projects子文件夹，但如果我可以将它们放入我的c:\inetpup\文件夹中，我会更喜欢它。
我好像也做不到。如果我在创建期间指定路径，则会收到以下错误 Error: name can only contain URL-friendly characters。我尝试了许多不同的格式vue create "vueprojects\helloworld"，，，vue create "vueprojects/helloworld/"等等。我什至真的是 vue ui，但它给了我一个 JS 运行时错误。vue create ".\vueprojects\helloworld"vue create "c:\inetpub\vueprojects\helloworld"
文档和我的 Google fu 让我失望了。似乎是一件很简单的事情，所以我很困惑。
vue.js - Getting error after successfully installiong axios vue plugin
so I wanted to add Axios to a Vue project. I did that by issuing vue add axios. It told me, the installation was successful but then I somehow get 5 errors. I don't fully get why it tells me it was installed when it seems there are still some jobs going on and more important: What is this error about??
I guess that it actually installed Axios but it wasn't able to generate that default code it usually adds? Is that bad? Why does it add code? Why can't I just use it as kind of a dependency manager?
webpack - 使用Vue-cli / webpack / nodenv解释dotenv和本地文件工作流程
我一直在努力解决如何做到这一点。我一直在开发一个 vue-cli 应用程序，显然，在节点世界中，我们都相信存在一种开发、一种登台和一种生产环境。
我一直在努力减少尽可能多的体力劳动，所以我不会手动移动文件、更改配置等。
我总共有 5 个环境，但是我需要用这个系统清理 3 个开发环境，我真的没有办法去做，所以我需要一些指导。
- 第一个开发环境，localhost:12345 - 我已将变量放置在它关闭身份验证的位置并指定 url 路径。如果这被称为 myLocal for process.env.NODE_ENV，那么我可以使用 env.mylocal 的变量。
- 第二个开发环境，localhost:12345（是的，相同的）-我已将变量放置在所有身份验证返回的位置，并且我指定了相同的 url 路径。如果这被称为 process.env.NODE_ENV 的 DevLocal，那么我可以使用 env.devlocal 的变量
- 第三个开发环境，dev.example.com/newAppLoc/web - 我已将变量放置在所有身份验证返回的位置，并指定了一个新的 url 路径。如果这被称为 process.env.NODE_ENV 的开发，那么我可以使用 env.development 的变量
第 4 和第 5 将分别是分期和生产。
如果我可以选择将自己的环境名称创建为 3 个以上，则可以避免这个问题。因为那时我需要做的就是指定要使用的环境，并让构建脚本运行。然后到那时，我可以发布我的整个 repo 而不必担心要发送哪些 env 文件，因为它已经在构建中指定了。
但由于我只能指定 3 个，我需要帮助来解决这个问题。我不得不担心我的文件被发送，因为担心一个文件的存在会覆盖另一个配置。我还必须担心我的文件被发送到其他人可以获取并覆盖他们的项目设置的 repo 上。在我看来，这整个计划似乎太浮夸了，我对这种严格和过度考虑的混乱相当悲观。然而，我很想知道我可以看到什么样的工作流程可以将其应用于 3 个以上的环境。
此外，我无法覆盖“开发”、“暂存”、“生产”的值。有一些检查可以防止您将值与其他内容进行比较。这意味着，在您的 webpack.config.js 或 vue.config.js 中，如果您的 process.env.NODE_ENV 是 MyLocal，并且您尝试将其与“MyLocal”进行比较，那么它实际上会变为 false。
这是我的 package.json 中的脚本
所以：
我刚在想：
- MyLocal 将与 .env.local 相同
- DevLocal 将与 .env.development.local 相同
- 开发将与 .env.development 相同
但问题是，你如何指定使用哪个？它们仅基于存在的优先级，这使得控制变得更加困难。