如何在服务器端渲染中使用webpack dll插件

我正在尝试使用webpack的dllPlugin来使我的块变小,并且我在客户端使它运行良好但在服务器端渲染中出错了.

我以此为例,使其更简单,这是我的演示代码:

webpack.config.dll.js

// webpack.config.dll.js
const path = require('path');
const webpack = require('webpack');

module.exports = {
  entry: {
    a: ['./a']
  },
  output: {
    path: path.join(__dirname, 'dist'),
    filename: '[name].js',
    library: '[name]'
  },
  plugins: [
    new webpack.DllPlugin({
      path: path.join(__dirname, 'dist', 'manifest.json'),
      name: '[name]'
    })
  ]
}

Run Code Online (Sandbox Code Playgroud)

webpack.config.js

// webpack.config.js
const path = require('path');
const webpack = require('webpack');

module.exports = {
  entry: './example',
  output: {
    path: path.join(__dirname, 'dist'),
    filename: 'output.js'
  },
  plugins: [
    new webpack.DllReferencePlugin({
      context: __dirname,
      manifest: require('./dist/manifest.json')
    })
  ]
};

Run Code Online (Sandbox Code Playgroud)

其他js代码和HTML代码是

// a.js
module.exports = 'a';

// example.js
console.log(require("./a"));

// index.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
</head>
<body>
  <script src="dist/a.js"></script>
  <script src="dist/output.js"></script>
</body>
</html>

Run Code Online (Sandbox Code Playgroud)

如果我在浏览器中打开index.html,它运行良好并在控制台中输出'a'.但如果我执行node dist/output.js,它将收到错误:

/WorkSpace/code/webpack/005_dllPluginDemo_20160813/dist/output.js:64
    module.exports = a;
                     ^

ReferenceError: a is not defined
    at Object.<anonymous> (/WorkSpace/code/webpack/005_dllPluginDemo_20160813/dist/output.js:64:19)
    at __webpack_require__ (/WorkSpace/code/webpack/005_dllPluginDemo_20160813/dist/output.js:20:30)
    at Object.module.exports (/WorkSpace/code/webpack/005_dllPluginDemo_20160813/dist/output.js:58:20)
    at __webpack_require__ (/WorkSpace/code/webpack/005_dllPluginDemo_20160813/dist/output.js:20:30)
    at Object.<anonymous> (/WorkSpace/code/webpack/005_dllPluginDemo_20160813/dist/output.js:48:14)
    at __webpack_require__ (/WorkSpace/code/webpack/005_dllPluginDemo_20160813/dist/output.js:20:30)
    at /WorkSpace/code/webpack/005_dllPluginDemo_20160813/dist/output.js:40:18
    at Object.<anonymous> (/WorkSpace/code/webpack/005_dllPluginDemo_20160813/dist/output.js:43:10)
    at Module._compile (module.js:413:34)
    at Object.Module._extensions..js (module.js:422:10)

Run Code Online (Sandbox Code Playgroud)

所以这意味着我不能在我的代码中要求output.js.不幸的是,当我尝试在服务器中渲染时,我需要这样做,就像这个样板

我认为问题是模块a已经被webpack处理了两次

那么有人遇到过这个问题吗？你是怎么解决的,希望你的回答,谢谢

归档时间：	9 年，5 月前
查看次数：	1166 次
最近记录：	9 年，5 月前