大佬教程收集整理的这篇文章主要介绍了node.js – 节点和浏览器中的Webpack外部,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
问题是,在服务器上的节点中运行时,浏览器窗口中存在的外部文件(在此实例中为Google Maps)显然不存在.除入口点文件外,代码完全相同.
index.html的:
// index.html <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=XXX"></script>
简化配置:
// Server Webpack config { entry: 'server.js',target: 'node',externals: { google: google } } // Client Webpack config { entry: 'client.js',target: 'browser',externals: { google: google } }
组件:
// The view which builds and runs fine in // the client but doesn't run on the server. var React = require('react'),css = require('./style.css'),google = require('google'); // Nope,not on the server obvIoUsly! var Component = React.createClass({ render: function () { return ( <div> // Do maps stuff </div> ); } }); module.exports = Component;
我的问题是我该如何处理?
Error: CAnnot find module 'google'
// Server Webpack config { entry: 'server.js',externals: { google: google },plugins: [ new webpack.DefinePlugin({ 'ENV.browser': false }),] } // Client Webpack config { entry: 'client.js',plugins: [ new webpack.DefinePlugin({ 'ENV.browser': true }),] } // The component var React = require('react'),css = require('./style.css'); if (ENV.browser) { var google = require('google'); } var Component = React.createClass({ render: function () { return ( <div> if (ENV.browser) { // Do maps stuff } </div> ); } }); module.exports = Component;
{ plugins: [ new webpack.NormalModulereplacementPlugin(/^google$/,'node-noop'),],}
以上是大佬教程为你收集整理的node.js – 节点和浏览器中的Webpack外部全部内容,希望文章能够帮你解决node.js – 节点和浏览器中的Webpack外部所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。