54sword / xiaoduyu.com

🐟小度鱼 - 年轻人的交流社区 https://www.xiaoduyu.com
597 stars 148 forks source link

windows上运行以后为什么样式不见了 #55

Closed skyliao1 closed 5 years ago

skyliao1 commented 5 years ago

image

54sword commented 5 years ago

应该和静态文件地址有关系, 看看控制台上是否错误,然后截图一下我看看。

skyliao1 commented 5 years ago

这是谷歌浏览器控制台 runtime.js:5 offline-plugin: runtime was installed without OfflinePlugin being added to the webpack.config.js. See https://goo.gl/2Ca7NO for details. client.js:92 [HMR] connected client.js:188 [HMR] bundle 'client' has 14 warnings client.js:189 chunk styles [mini-css-extract-plugin]Conflicting order between: css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/captcha-button/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/settings/avatar/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/qiniu-upload-image/qiniu.scsschunk styles [mini-css-extract-plugin]Conflicting order between: css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/countries-select/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/settings/oauth/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/settings/avatar/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/qiniu-upload-image/qiniu.scsschunk styles [mini-css-extract-plugin]Conflicting order between: css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/html-text/style.scss css ./node_modules/css-loader!./node_modules/postcss-loader/src??ref--6-3!./src/app/components/editor/RichEditor.css css ./node_modules/css-loader!./node_modules/postcss-loader/src??ref--6-3!./node_modules/draft-js/dist/Draft.css css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/qiniu-upload-image/qiniu.scsschunk styles [mini-css-extract-plugin]Conflicting order between: css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/qiniu-upload-image/qiniu.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/follow/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-detail/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/ui/content-loading/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/share/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/comment-list/components/button/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/more-menu/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/message-list/index.scsschunk styles [mini-css-extract-plugin]Conflicting order between: css ./node_modules/css-loader!./node_modules/postcss-loader/src??ref--6-3!./node_modules/draft-js/dist/Draft.css css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/follow/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-detail/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/ui/content-loading/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/share/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/comment-list/components/button/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/more-menu/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/message-list/index.scsschunk styles [mini-css-extract-plugin]Conflicting order between: css ./node_modules/css-loader!./node_modules/postcss-loader/src??ref--6-3!./src/app/components/editor/RichEditor.css css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/follow/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-detail/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/ui/content-loading/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/share/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/comment-list/components/button/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/more-menu/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/message-list/index.scsschunk styles [mini-css-extract-plugin]Conflicting order between: css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/editor-comment/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/follow/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-detail/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/ui/content-loading/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/share/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/comment-list/components/button/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/more-menu/style.scsschunk styles [mini-css-extract-plugin]Conflicting order between: css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/more-menu/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/feed-list/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/feed-list/components/item-comment/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-list/components/item-poor/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-list/components/item-rich/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/follow-list/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/ui/content-loading/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/follow/style.scsschunk styles [mini-css-extract-plugin]Conflicting order between: css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/follow/style.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-detail/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/ui/content-loading/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-list/components/item-poor/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-list/components/item-rich/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/layout/single-columns/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/people-list/components/list-item/index.scsschunk styles [mini-css-extract-plugin]Conflicting order between: css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/components/ui/content-loading/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-list/components/item-poor/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-list/components/item-rich/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/case/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/footer/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/links-exchange/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/topics/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/layout/two-columns/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/layout/single-columns/index.scsschunk styles [mini-css-extract-plugin]Conflicting order between: css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/ads/author/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/layout/two-columns/index.scsschunk styles [mini-css-extract-plugin]Conflicting order between: css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/layout/two-columns/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/feed-list/components/new-tips/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/feed-list/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/feed-list/components/item-comment/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-list/components/item-poor/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-list/components/item-rich/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-list/components/new-tips/index.scsschunk styles [mini-css-extract-plugin]Conflicting order between: css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-list/components/item-rich/index.scss css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/layout/single-columns/index.scsschunk styles [mini-css-extract-plugin]Conflicting order between: css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/modules/posts-list/components/item-poor/index.scss * css ./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??ref--5-3!./node_modules/sass-loader/lib/loader.js!./src/app/layout/single-columns/index.scss jquery.js:9725 [Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/. send @ jquery.js:9725 index.ts:75 socket connect success.

这是npm控制台 npm run start

xiaoduyu.com@2.7.0 start D:\react_learning\xiaoduyu.com-master2 cross-env NODE_ENV=development node ./scripts/start.js

(node:9024) DeprecationWarning: Tapable.plugin is deprecated. Use new API on .hooks instead Hash: 54aaeb4d22586f1ad6ae Version: webpack 4.35.3 Time: 43179ms Built at: 2019-07-31 16:00:36 Asset Size Chunks Chunk Names 0.server.js 17.7 KiB 0 [emitted] 1.server.js 12.9 KiB 1 [emitted] 10.server.js 53.2 KiB 10 [emitted] 11.server.js 32.7 KiB 11 [emitted] 12.server.js 33.6 KiB 12 [emitted] 13.server.js 37.9 KiB 13 [emitted] 14.server.js 138 KiB 14 [emitted] 15.server.js 105 KiB 15 [emitted] 16.server.js 36.4 KiB 16 [emitted] 17.server.js 32.4 KiB 17 [emitted] 18.server.js 39.1 KiB 18 [emitted] 19.server.js 27 KiB 19 [emitted] 2.server.js 16.4 KiB 2 [emitted] 20.server.js 23.4 KiB 20 [emitted] 21.server.js 31.4 KiB 21 [emitted] 22.server.js 27 KiB 22 [emitted] 23.server.js 35.8 KiB 23 [emitted] 24.server.js 25.6 KiB 24 [emitted] 25.server.js 26.4 KiB 25 [emitted] 26.server.js 9.28 KiB 26 [emitted] 27.server.js 11.6 KiB 27 [emitted] 28.server.js 11.2 KiB 28 [emitted] 29.server.js 9.79 KiB 29 [emitted] 3.server.js 24.8 KiB 3 [emitted] 30.server.js 11.8 KiB 30 [emitted] 31.server.js 3.49 KiB 31 [emitted] 4.server.js 17.3 KiB 4 [emitted] 5.server.js 19.6 KiB 5 [emitted] 6.server.js 26.4 KiB 6 [emitted] 7.server.js 17.9 KiB 7 [emitted] 8.server.js 21.3 KiB 8 [emitted] 9.server.js 11.6 KiB 9 [emitted] server.js 287 KiB app [emitted] app views/includes/head.ejs 1.56 KiB [emitted] views/pages/comment-detail.ejs 7.86 KiB [emitted] views/pages/posts-detail.ejs 7.92 KiB [emitted] Entrypoint app = server.js [0] multi ./src/server/index 28 bytes {app} [built] [./config/feature.config.js] 828 bytes {app} [built] [./config/index.js] 2.69 KiB {app} [built] [./src/server/amp/index.ts] 1.1 KiB {app} [built] [./src/server/cache.ts] 619 bytes {app} [built] [./src/server/index.ts] 64 bytes {app} [built] [./src/server/log4js.ts] 2.07 KiB {app} [built] [./src/server/render.tsx] 7.06 KiB {app} [built] [./src/server/server.ts] 4.92 KiB {app} [built] [./src/server/sign.ts] 978 bytes {app} [built] [@babel/polyfill] external "@babel/polyfill" 42 bytes {app} [built] [body-parser] external "body-parser" 42 bytes {app} [built] [compression] external "compression" 42 bytes {app} [built] [cookie-parser] external "cookie-parser" 42 bytes {app} [built] [express] external "express" 42 bytes {app} [built]

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

WARNING in chunk styles [mini-css-extract-plugin] Conflicting order between:

skyliao1 commented 5 years ago

image 我感觉应该是这里问题

54sword commented 5 years ago

这个警告我这边也有,是mini-css-extract-plugin的一个问题,从打印的日志看,没有看出问题原因。

可能原因1 查看页面html源代码中,http://localhost:4001/styles.css 文件是否可以正常访问。

可能原因2 配置文件中,classScopedName,是否有修改过呢? https://github.com/54sword/xiaoduyu.com/blob/master/config/index.default.js#L33

可以到页面中,随意找一个class,例如:index_header__2xFxU(需要在你的项目中找),然后在http://localhost:4001/styles.css文件中搜索,是否存在index_header__2xFxU这个class。

如果不存在,原因是服务端生成的className和客户端生成的className不一致,需要检查 https://github.com/54sword/xiaoduyu.com/blob/master/config/index.default.js#L33

可能原因3 可能这个问题只会在windows出现,我这边没有windows机器,排查不了这个问题。

skyliao1 commented 5 years ago

确认了服务端生成的className和客户端生成的className不一致 很奇怪的是俩边配置文件的localIdentName 是一样的,这可能是windows上莫名其妙的问题吧。。。。。。

54sword commented 5 years ago

问题已修复,重新clone一下启动应该就可以了

skyliao1 commented 5 years ago

嗯,大神亲测,windows上已经好了