问题标签 [vue-storefront]

我有两个域。

farrwest.com（在端口 3000 上运行 vuestore，在 8080 上运行 vuestore-api）

和

dev.farrwest.com（在端口 3001 上运行 vuestore）

我.htaccess在两个域的根目录上都添加了重写规则。

使用以下配置。

farrwest.com：

dev.farrwest.com：

两个站点都加载正常，除了在加载之前它们进入 404 页面未找到，然后页面被加载。

我会在 apache virtualhost 上使用反向代理，但我在 cpanel 中找不到它的配置。

并且使用 htaccess 我试图找到解决方法，但没有找到任何解决此问题的方法。

I have very bad expirience with Vuestorefront rebuilding because every change in code takes about 25 second. So I decided to turn off SSR (for development) and now it takes about 3-4 seconds! ...but now there is problem with VueJs lifecycle.

What I use

1. Official Vuestorefront repo: https://github.com/vuestorefront/vue-storefront

Storefront is installed with: yarn, demo API, SSR endpoints and default theme. Everything works perfectly, but it is slow for development.

2. Optimized Webpack configuration: https://github.com/yireo-training/vsf1-local-webpack

Following tutorial in readme everything works fine, every change in code is builded in 4 second. Successful build automatically refresh website with hot-reload.

What is the problem?

• I can't open any link directly (link to product, category, etc...) and can't refresh/reload any page

I find out in these cases is skipped function asyncData which preload data. For example product page: https://github.com/vuestorefront/vsf-default/blob/master/pages/Product.vue#L334 When I click on product detail from homepage, function asyncData is triggered and product page is correctly loaded but with refresh (F5) is asyncData skipped.

Product page after reload:

I tried to reimplement code from asyncData to method beforeCreated but it still doesn't work.

My question

How to force calling function asyncData?

...or is there way to reconfigure Webpack to make this work?

...or is there another way to rebuild vuestorefront faster?

将Algolia 搜索与VSF/Next 分支集成，了解基础知识。继续路由。

使用Vanilla Nuxt，集成可以正常工作，尽管变通方法开始叠加。

复制：

1. 拉 && 纱线 && 纱线运行开发
2. http://192.168.1.4:3000/ && 搜索东西
3. URL被重写

结帐VSF得到一个闪烁的重新渲染。

复制：

1. 与上述相同，只是转到 /Search
2. URL 被重写为 flash 然后渲染触发并返回到原始路由

我试过的：

1. 单独构建两个存储库，这似乎不是 nuxt 本身的问题，更多的是 Vue StoreFront 的问题

参考： https ://github.com/algolia/vue-instantsearch/issues/916 （切线）

如何在 Vuestorefront 上运行 elasticsearch 查询？我有以下查询：

我想要我的 VSF 上的数据。

我创建了一个名为 .well-known 的文件夹，并在其中创建了文件assetlinks.json，但无法使用 url 直接从浏览器访问该文件。出现以下错误：

我需要修改 vuestorefront/core/modules/catalog/helpers/search.ts 下的 'preConfigureProduct' 功能

https://github.com/vuestorefront/vue-storefront/blob/hotfix/v1.12.3/core/modules/catalog/helpers/search.ts#L51

我需要根据我的客户要求进行定制。因此我需要在我的项目中覆盖这个函数。但是没有关于如何从帮助程序覆盖一个函数的文档。我也是 vue 店面的新手，所以我不完全了解模块扩展或混合。

提前致谢。

我有一个与 magento 2 后端集成的 vue-storefront 项目。在我的 Magento 后端，我有一个自定义表格。我还进行了 api 调用来检索该表的信息。

如何在 vue 店面中添加该 api 请求，以便我可以在我的前端显示信息？

我已经创建了一个 cms 页面并在其中添加了内容，它工作正常。然后我使用命令安装 vue-carousel-3d 并将组件和滑块代码添加到该文件中。添加组件的代码如下：

从'vue'导入Vue；从“vue-carousel-3d”导入 Carousel3d；

Vue.use(Carousel3d);

然后，当我单击该 cms 页面的链接时，它是打开的页面，并且还会显示滑块，我再次刷新同一页面，然后它会为我抛出 500 错误。pm2 日志中的错误是：

ReferenceError: 文档未定义在 addStyle (/root/vue-storefront/node_modules/vue-carousel-3d/dist/webpack:/carousel-3d/node_modules/vue-style-loader/lib/addStylesClient.js:120:1 ) 在 addStylesToDom (/root/vue-storefront/node_modules/vue-carousel-3d/dist/webpack:/carousel-3d/node_modules/vue-style-loader/lib/addStylesClient.js:104:1) 在 addStylesClient (/ root/vue-storefront/node_modules/vue-carousel-3d/dist/webpack:/carousel-3d/node_modules/vue-style-loader/lib/addStylesClient.js:58:1) 在 Object.5701 (/root/vue -storefront/node_modules/vue-carousel-3d/dist/webpack:/carousel-3d/src/carousel-3d/Slide.vue?567f:9:1) 在webpack_require(/root/vue-storefront/node_modules/vue-carousel-3d/dist/webpack:/carousel-3d/webpack/bootstrap:19:1) 在 Object.9c17 (/root/vue-storefront/node_modules/vue-carousel -3d/dist/webpack:/carousel-3d/src/carousel-3d/Slide.vue?24f7:1:1) 在webpack_require (/root/vue-storefront/node_modules/vue-carousel-3d/dist/webpack: /carousel-3d/webpack/bootstrap:19:1) 在 Module.fb15 (/root/vue-storefront/node_modules/vue-carousel-3d/dist/carousel-3d.common.js:3635:45) 在webpack_require ( /root/vue-storefront/node_modules/vue-carousel-3d/dist/webpack:/carousel-3d/webpack/bootstrap:19:1) 在/root/vue-storefront/node_modules/vue-carousel-3d/dist/ webpack:/carousel-3d/webpack/bootstrap:83:1

请问有人知道这个问题吗？

如果可以的话请帮忙。我无法让 vue 店面网站显示所做的更改。

情况 - 我有一个在线开发站点，它目前正在运行默认主题，并使用默认产品连接到 magento 2。它似乎可以正常工作。根据我阅读的文档和教程，我应该 ssh 进入我的 vuestore，并在该目录中运行yarn dev. 据我了解，这应该响应对 vuestore 目录中任何内容的更改，就像 npm run watch 一样。

但是，没有任何更新。我尝试进行最简单的更改以应用和查看，例如注释掉<head-image />组件，或更改提供给组件的 json 数据<promoted-offers />。当我进行更改并保存更改时，我在终端中看到它已重新编译，但当我在浏览器中重新加载（硬重新加载）站点时没有任何变化。在不同的时间，我尝试过 yarn install、yarn update 和 yarn start，都没有影响在浏览器中看到的内容。

问题是，进行更改和更新 vuestore 的正确程序是什么？

如何在 nginx 中使用以下 htaccess 规则？

所以如果用户访问http://lovelythings.buzz/api或者img它应该使用本地端口8080。

但是当尝试访问其他路由http://lovelythings.buzz时，它会被代理到端口 3000 或 3001

我已经在 .htaccess 上为 Apache2 服务器实现了这一点。

但在其他服务器上我安装了 Nginx 并且 Nginx 不支持.htaccess。

以下是.htaccess，我正在尝试在 Nginx 上运行。