你好，请问一下 - Githubissues

jsm1003 commented 7 years ago

我是在你最新的介绍vue-ssr的下面留言的那个人，我想问一下api服务器和网站服务器是怎样一个关系，可不可以用leancloud的服务呢？那么你在那里买的服务器呢？

lincenying commented 7 years ago

api服务器就是纯后端的, 不需要提供任何可以供浏览器访问的页面, 只提供api地址给前端数据因为ssr, 也需要nodejs做后端, 所以网站服务器就是常规的nodejs服务器 api服务器可以直接用leancloud, 我的服务器是阿里云的... 之前版本的api就是用lc的, https://github.com/lincenying/mmf-blog-vue2-ssr/blob/0bcb9201e9389a9fc82c51896ec48539f5fe348c/src/api/index.js

jsm1003 commented 7 years ago

@lincenying 如何clone 你这个用leancloud分支下的代码呢？你这个分支怎么显示一个tree，而不现实branch呢？

lincenying commented 7 years ago

这个是老代码, 当时没用弄分支, 只能从代码提交记录里看了...那时候还没写完, 可能接口也不全. 个人觉得直接用leancloud, 问题还是不小的, 主要是nodejs端和浏览器的代码不是很统一... 如果用nodejs封装下接口再用, 可能会比较好一点...

jsm1003 commented 7 years ago

@lincenying 怎么理解不是很统一...具体指哪里不统一呢，我的代码前端部分差不多弄好了(也是参照你的代码弄了一个blog)，现在想在弄一下ssr，然后发布，但是我后端这一块接触比较少，用leancloud的话对于我来说少写很多代码，然后你说不是很统一，如果不用leancloud的话得自己买一个服务器然后自己搭数据库，感觉坑很多啊，我该怎么办？还有你说的用nodejs封装一下接口的具体思路是什么？

jsm1003 commented 7 years ago

@lincenying 我刚看了一下leancloud的文档，如果我想继续用leancloud并且实现ssr，一个应用服务器，一个api服务器，我是不是得购买专业版让后使用两个基本资源（它的文档是这么叫的），一个基本资源弄成应用服务器，一个基本资源弄成api服务器，你看我理解的对不对？

lincenying commented 7 years ago

ssr 浏览器端和nodejs端的代码是共用的, 比如获取登录信息, 两边的方法就不一样, 就会造成有一端不能获取到登录信息, 具体有哪些不同点, 可以看lc的官方文档 api服务器和网站服务器可以用一台主机, 起两个nodejs服务就行了. nodejs封装, 就是用nodejs来读取/发送leancloud请求, 然后通过nodejs暴露出api地址, 这个api地址就可以nodejs端和浏览器端一起用

jsm1003 commented 7 years ago

leancloud 只用一台主机如何起两个node服务呢？

lincenying commented 7 years ago

用forever启动nodejs, 可以保持后台运行, 起多少个都可以...只要服务器资源够用... 命令格式参考: https://github.com/foreverjs/forever

jsm1003 commented 7 years ago

那leancloud自带的cli工具使用lean up命令也是用的forever吗

lincenying commented 7 years ago

没用过这个cli工具, 不太清楚

jsm1003 commented 7 years ago

在app.js中引入css文件，import './test.css' 打包时报错， You may need an appropriate loader to handle this file type. | body { | background: #058 | } ，是webpack哪里没有配置好？需要怎么改这问题纠结了我一天了，是不是bug？

lincenying commented 7 years ago

参考app.vue文件的css引入方式, 这是ssr的问题...server入口是不会去处理css的, 因为没意义...

jsm1003 commented 7 years ago

好吧。。。。谢谢指点

jsm1003 commented 7 years ago

你好，vue如何操作v-html里面的标签？

lincenying commented 7 years ago

你是要编辑html串? v-html="modify(html)"

methods: {
  modify(str) {
    return str + '123'
  }
}

jsm1003 commented 7 years ago

比如我想点击v-html中的某个标签，给里面的标签添加样式，如何操作？我这么想是因为我想增加这么一项功能，就是我点击v-html渲染出来的标签，让这个图片变成放大预览状态，就像知乎问答中，点击一个图片出现查看大图的这么一个效果顺便让我关注一下你的知乎账号吧(●'◡'●)

lincenying commented 7 years ago

v-html里的html片段不能绑定vue事件, 所以只能在dom渲染完成后, 用原生事件来绑定图片如果html片段是ajax请求来的, 在nextTick里绑定事件

jsm1003 commented 7 years ago

你好vue如何（实时的）获取window的一些事件，比如window的 resize事件？能否贴一点代码参考一下

lincenying commented 7 years ago

在mounted阶段绑定事件, 组件注销时要把事件解绑, 不然会造成所有页面都有该事件

jsm1003 commented 7 years ago

@lincenying 谢谢！

jsm1003 commented 7 years ago

我想问一下你的用户登陆这一块，密码是明文传输的？这样不太好吧？

jsm1003 commented 7 years ago

我想问一下，你在获取route对象的时候为什么用this.$store.state.route, 而不是用this.$route呢？有什么异同吗？

lincenying commented 7 years ago

在fetchInitialData里只能用store读取路由, 组件里的可能随手复制了吧, 关系不大, 多写几个字符, 组件里用this.$route更好.

jsm1003 commented 7 years ago

我想问一下，你的文章列表页面的文章正文是只读取部分文章内容，这一块你是怎么写的，是发布文章的时候对文章内容进行截取指定长度单独保存在一个字段里吗？还是别的办法？

lincenying commented 7 years ago

在组件里截断.

jsm1003 commented 7 years ago

你好，我想问一下，vue2里面关于组件缓存的问题，vue有一个自带的keepalive组件，在ssr渲染是还有一个组件缓存的介绍https://cn.vuejs.org/v2/guide/ssr.html#设置，我想问一下这两种缓存方式有什么异同呢？

lincenying commented 7 years ago

一个是服务端缓存，一个是客户端缓存

jsm1003 commented 7 years ago

@lincenying 谢谢！能说一下用了服务端缓存具体表现在哪里吗？我主要是不明白这两种缓存的具体应用场景。在什么情况下使用客户端缓存，有在什么情况下使用服务端缓存呢？

lincenying commented 7 years ago

服务端缓存所有人访问者都可以用, 客户端缓存只有缓存的用户可以用.

jsm1003 commented 7 years ago

你好如何查看prefetch钩子已经生效？我设置了prefetch钩子，在网页上右击查看源码却没有看到html渲染成功？是不是所有的需要ajax获取的异步数据都需要prefetch，

jsm1003 commented 7 years ago

靠，我知道了，我在prefetch钩子函数里面忘了写 return了，不过还是谢谢了

jsm1003 commented 7 years ago

我在我的项目npm run dev的时候可以正常运行，但是我npm run build的时候却没有将vue文件里的css提取出来，这是什么原因？我的webpack配置是参照你的写的。我的项目地址https://github.com/ZinCode/vue-ssr-blog-client 我的项目也参照了不少你的代码。。。

jsm1003 commented 7 years ago

哈，我自己解决了，是我的new ExtractTextPlugin('static/css/[name].[hash:7].css')这里没有写好，不过还是非常感谢你的项目，我自己的项目的很多思路都是源自你的项目

jsm1003 commented 7 years ago

你好，有没有什么react的相关中文文档呢？

lincenying commented 7 years ago

https://hulufei.gitbooks.io/react-tutorial/content/introduction.html

jsm1003 commented 7 years ago

鞋鞋

jsm1003 commented 7 years ago

你好，我现在打包图片的时候遇到一个问题，过程是这样的我执行 npm run dev 可以正常运行，我直接链接到带有图片的url页面，提示错误 [Vue warn]: Error when rendering component at F:\workspace\Vue\ssr\my-ssr\middle\src\components\item-list.vue: error during render : /articles Error: Module parse failed: F:\workspace\Vue\ssr\my-ssr\middle\src\assets\img\auth.png Unexpected character '�' (1:0) You may need an appropriate loader to handle this file type. 但是，我先连接到没有图片的页面，正常，在通过路由跳转到有图片的页面，这时候正常了，可以显示页面，但是我右击查看网页源代码时，又出现‘Internal Error 500’错误，是我webpack哪里没有配置好吗？

帮忙看一下我的webpack配置吧https://github.com/ZinCode/vue-ssr-blog-client/tree/master/build 我的web pack配置是参照你的写的https://github.com/lincenying/vue2-multiple-entry

jsm1003 commented 7 years ago

还有一个问题，就是我在css或者img标签里面引入图片的地址为什么不支持webpack的写好的地址，还必须得一层一层往前推？

lincenying commented 7 years ago

这两个, 我也用不了别名, 可能是webpack的问题吧.

lincenying commented 7 years ago

你没有配置图片加载器

https://github.com/lincenying/mmf-blog-vue2-ssr/blob/master/build/webpack.client.dev.config.js#L7-L13

https://github.com/lincenying/mmf-blog-vue2-ssr/blob/master/build/webpack.client.prod.config.js#L9-L16

jsm1003 commented 7 years ago

https://github.com/ZinCode/vue-ssr-blog-client/blob/master/build/dev-config.js#L22-L33 我配置了啊？我从没有图片的页面路由到有图片的页面，正常显示，可以看到图片被打包了，但是直接链接到有图片的页面，就报错了，我这个打包图片的错误好像只在服务端渲染才报错，客户端渲染正常。

jsm1003 commented 7 years ago

我npm run dev后输出这些东西

keywords if/then/else require v5 option
server started at http://localhost:8080
./src/assets/img/auth.jpg
Module parse failed: F:\workspace\Vue\ssr\my-ssr\ssr\src\assets\img\auth.jpg Unexpected character '�' (1:0)
You may need an appropriate loader to handle this file type.
(Source code omitted for this binary file)
 @ ./~/vue-loader/lib/template-compiler.js?id=data-v-1c7b7c79!./~/vue-loader/lib/selector.js?type=template&index=0!./src/pages/client/about/resume.vue 15:13-52
 @ ./src/pages/client/about/resume.vue
 @ ./src/router/index.js
 @ ./src/entries/app/app.js
 @ ./src/entries/app/server-entry.js
./src/assets/img/auth.png
Module parse failed: F:\workspace\Vue\ssr\my-ssr\ssr\src\assets\img\auth.png Unexpected character '�' (1:0)
You may need an appropriate loader to handle this file type.
(Source code omitted for this binary file)
 @ ./~/vue-loader/lib/template-compiler.js?id=data-v-636917fa!./~/vue-loader/lib/selector.js?type=template&index=0!./src/pages/client/article/article.vue 11:13-52
 @ ./src/pages/client/article/article.vue
 @ ./src/router/index.js
 @ ./src/entries/app/app.js
 @ ./src/entries/app/server-entry.js
webpack built 36b9fc43ad277d9f6b30 in 13479ms
Hash: 36b9fc43ad277d9f6b30
Version: webpack 2.1.0-beta.28
Time: 13479ms
                  Asset       Size  Chunks           Chunk Names
              vendor.js     526 kB  3[emitted]  [big]vendor
       auth.334ea3a.jpg    7.42 kB  [emitted]
gradient-bg.50e9717.png  690 bytes  [emitted]
       snow.adff61f.png    59.3 kB  [emitted]
     winter.fa001dd.jpg     202 kB  [emitted]
                 app.js    1.04 MB  0[emitted]  [big]app
               login.js    24.1 kB  1[emitted]  login
               admin.js    19.3 kB  2[emitted]  admin
       auth.6b79f6b.png      19 kB  [emitted]
             app.js.map    1.32 MB  0[emitted]  [big]app
           login.js.map    35.1 kB  1[emitted]  login
           admin.js.map    30.7 kB  2[emitted]  admin
          vendor.js.map     640 kB  3[emitted]  [big]vendor
             admin.html  623 bytes  [emitted]
               app.html  805 bytes  [emitted]
             login.html  365 bytes  [emitted]

你看他一开始提示没找到合适的图片加载器，但是最终他是打包成功的，这很奇怪

lincenying commented 7 years ago

{
                test: /\.(jpg|png|gif|eot|svg|ttf|woff|woff2)$/,
                loader: 'url-loader',
                options: {
                    limit: 10000,
                    name: 'static/images/[name].[hash:7].[ext]'
                }
            }

我clone你的项目后, 改了这个配置后, build并没有报错

或者用下面方法

把图片放到static文件夹, img 链接时直接用绝对路径, 不让webpack处理图片, 打包时, 把static拷到dist目录下.

jsm1003 commented 7 years ago

你是clone的我最新的这个配置吗？，我最近这个配置，打包是不报错，因为我把url-loader这一块放到了webpack.base.config.js 这个文件下，我向你提问的报错的那个配置是，url-loader这一块分别放到了dev-config.js和prod-config.js这两个文件下，你可以通过最新的这个配置下的这两个文件里面的注释看出来。

跟图片的路径应该没有关系。

lincenying commented 7 years ago

你放dev和prod里去, 服务端打包就没有图片处理的loader当然要报错

jsm1003 commented 7 years ago

那应该怎么改让服务端打包也生效？

lincenying commented 7 years ago

要么放在webpack.base里, 不然就到webpack.server里添加图片处理loader

jsm1003 commented 7 years ago

那我想让dev和prod环境下的loader配置不同怎么弄？

lincenying commented 7 years ago

到webpack.server里添加图片处理loader

jsm1003 commented 7 years ago

你好，你的代码下载下来yarn install完了之后npm run build打包报错，

ERROR in ./~/extract-text-webpack-plugin/loader.js?{"omit":1,"remove":true}!./~/vue-style-loader!./~/css-loader!./~/vue-loader/lib/style-rewriter.js?id=data-v-b5908b80!./~/postcss-loader!./~/vue-loader/lib/selector.js?type=styles&index=0!./~/eslint-loader!./src/pages/frontend-about.vue
Module build failed: Error: "extract-text-webpack-plugin" loader is used without the corresponding plugin, refer to https://github.com/webpack/extract-text-webpack-plugin for the usage example
    at Object.module.exports.pitch (F:\workspace\Vue\ssr\final\mmf-blog-vue2-ssr\node_modules\extract-text-webpack-plugin\loader.js:26:9)
 @ ./src/pages/frontend-about.vue 3:0-343
 @ ./src/router/index.js
 @ ./src/app.js
 @ ./src/server-entry.js

应该是更新了哪个包的问题，我的也是同样的错误

lincenying / mmf-blog-vue2-ssr

你好，请问一下 #1