search

kkfor / for-editor

for-editor - A markdown editor based on React
https://md.kkfor.com/
MIT License
405 stars 77 forks source link

window is not defined #7

Closed luhaopeng closed 5 years ago

luhaopeng commented 5 years ago

环境

node v10.15.0 npm v6.5.0 react ^16.7.0 next ^7.0.2

版本

0.0.11

问题

console打印window is not defined

console输出信息 
      
ReferenceError: window is not defined
    at Object. (E:\WebstormProjects\personal-site\node_modules\for-editor\dist\index.js:1:286)
    at Module._compile (internal/modules/cjs/loader.js:689:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
    at Module.load (internal/modules/cjs/loader.js:599:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
    at Function.Module._load (internal/modules/cjs/loader.js:530:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.for-editor (E:\WebstormProjects\personal-site\.next\server\static\development\pages\manage.js:879:18)
    at __webpack_require__ (E:\WebstormProjects\personal-site\.next\server\static\development\pages\manage.js:23:31)
    at Module../pages/manage.js (E:\WebstormProjects\personal-site\.next\server\static\development\pages\manage.js:466:68)
    at __webpack_require__ (E:\WebstormProjects\personal-site\.next\server\static\development\pages\manage.js:23:31)
    at Object.3 (E:\WebstormProjects\personal-site\.next\server\static\development\pages\manage.js:735:18)
    at __webpack_require__ (E:\WebstormProjects\personal-site\.next\server\static\development\pages\manage.js:23:31)
    at E:\WebstormProjects\personal-site\.next\server\static\development\pages\manage.js:91:18
    at Object. (E:\WebstormProjects\personal-site\.next\server\static\development\pages\manage.js:94:10)

可能的原因

dist/index.js是适合web环境而非node环境的代码，其中有window对象，而node环境中没有window对象

可能的解决方式

将src/main.js发布到npm仓库，将dist/index.js发布到cdn

kkfor commented 5 years ago

本项目依赖了一些DOM和BOM的API，没办法做到支持服务端渲染哦，而且此类组件其实也没必要放到服务端渲染的。

luhaopeng commented 5 years ago

我看到src里面的代码都是node环境的，也许你的意思是打包发布的时候会有依赖了一些DOM和BOM的API。

我现在在尝试用next.js写自己的个人网站，还在学习中，还没用到服务端渲染，只是在node环境用react写。但是npm install for-editor之后还是不能import/require，就不能用react了（或者是我哪里操作有误吗？但的确install下来的代码只有web的）。

我目前的做法是将src里的代码拷出来，把iconfont目录删掉，改用antd的Icon（iconfont那一堆文件要引入很头疼，就想着通过Icon.createFromIconfontCN()来做了）

附上我npm install for-editor之后的内容，这些代码无法通过import Editor from 'for-editor'来使用。

qq 20190201142417

kkfor commented 5 years ago

我看到src里面的代码都是node环境的，也许你的意思是打包发布的时候会有依赖了一些DOM和BOM的API。

我现在在尝试用next.js写自己的个人网站，还在学习中，还没用到服务端渲染，只是在node环境用react写。但是npm install for-editor之后还是不能import/require，就不能用react了（或者是我哪里操作有误吗？但的确install下来的代码只有web的）。

我目前的做法是将src里的代码拷出来，把iconfont目录删掉，改用antd的Icon（iconfont那一堆文件要引入很头疼，就想着通过Icon.createFromIconfontCN()来做了）

附上我npm install for-editor之后的内容，这些代码无法通过import Editor from 'for-editor'来使用。

qq 20190201142417

next.js是 React 服务端渲染应用框架