我正在努力寻找一个如何设置webpack包的输出文件的公共路径的示例.
If you don’t kNow the publicPath while compiling,you can omit it and
set__webpack_public_path__
on your entry point.
像这样:
__webpack_public_path__ = myRuntimePublicPath
解决方法
近两年后没有任何改变.在运行时找到为webpack设置公共路径的示例仍然令人惊讶地困难.
先决条件
> webpack 4.5.0
>一个足以利用代码拆分的应用程序
为简单起见,假设我们的html位于index.html,app入口点为app.js
一个有效的例子
的index.html
<!DOCTYPE html> <html lang="en"> <head></head> <body> <div id="app"></div> <script type="application/javascript"> window.resourceBasePath = '/path/to/scripts/on/server/'; </script> <script type="application/javascript" src="/path/to/scripts/on/server/app.js"></script> </body> </html>
app.js
// it is important to set global var before any imports __webpack_public_path__ = window.resourceBasePath; import React from 'react'; import ReactDOM from 'react-dom'; import {store,history} from './store'; const render = () => { import('./root').then((module) => { const Root = module.default; ReactDOM.render( <Root store={store} history={history} />,document.getElementById('app'),); }); }; render(); if (module.hot) { module.hot.accept('./root',render); }
一个不起作用的例子
Webpack publicPath documentation说仅仅设置一个具有正确名称的全局变量就足够了.我这样做了:
的index.html
<!DOCTYPE html> <html lang="en"> <head></head> <body> <div id="app"></div> <script type="application/javascript"> __webpack_public_path__ = '/path/to/scripts/on/server/'; </script> <script type="application/javascript" src="/path/to/scripts/on/server/app.js"></script> </body> </html>
app.js
import React from 'react'; import ReactDOM from 'react-dom'; import {store,render); }
在这种情况下,我的应用程序无法在控制台中抱怨它无法将当前路径中的0.js加载到index.html.这意味着设置公共路径没有任何影响.
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。