npm run build生成server-build文件夹里的内容不是vue-ssr-erver-bundle.json'文件

来源:5-6 生产环境服务端渲染

蓝with黑

2018-06-24


npm run build生成server-build文件夹里的内容不是vue-ssr-erver-bundle.json'文件

但是package.json和webpack.config.server.js都和课程远吗一致。

奇怪的是,我下载课程源码本地打包也是这样,没有生成vue-ssr-erver-bundle.json

http://img.mukewang.com/szimg/5b2f94aa0001e70902200226.jpg


webpack.config.server.js

const path = require('path')
const ExtractPlugin = require('extract-text-webpack-plugin')
const webpack = require('webpack')
const merge = require('webpack-merge')
const baseConfig = require('./webpack.config.base')
const VueServerPlugin = require('vue-server-renderer/server-plugin')

let config

const isDev = process.env.NODE_ENV === 'development'

const plugins = [
new ExtractPlugin('styles.[contentHash:8].css'),
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development'),
'process.env.VUE_ENV': '"server"'
})
]

if (isDev) {
plugins.push(new VueServerPlugin())
}

config = merge(baseConfig, {
target: 'node',
entry: path.join(__dirname, '../client/server-entry.js'),
devtool: 'source-map',
output: {
libraryTarget: 'commonjs2',
filename: 'server-entry.js',
path: path.join(__dirname, '../server-build')
},
externals: Object.keys(require('../package.json').dependencies),
module: {
rules: [
{
test: /\.styl/,
use: ExtractPlugin.extract({
fallback: 'vue-style-loader',
use: [
'css-loader',
{
loader: 'postcss-loader',
options: {
sourceMap: true
}
},
'stylus-loader'
]
})
}
]
},
plugins
})

config.resolve = {
alias: {
// server-model.js
'model': path.join(__dirname, '../client/model/server-model.js')
}
}

module.exports = config




package.json

"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build:client": "cross-env NODE_ENV=production webpack --config build/webpack.config.client.js",
"build:server": "cross-env NODE_ENV=production webpack --config build/webpack.config.server.js",
"build": "npm run clean && npm run build:client && npm run build:server",
// 略
},


写回答

2回答

忍者阿龙

2021-11-29

我把

if (isDev) {
  plugins.push(new VueServerPlugin())
}

里面的

new VueServerPlugin()

放到

const plugins = [
  new ExtractPlugin('styles.[contentHash:8].css'),
  new webpack.DefinePlugin({
    'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development'),
    'process.env.VUE_ENV': '"server"'
  }),
  new VueServerPlugin()
]

里面以后,出现json文件了

0
0

Jokcy

2018-06-25

我课程后面有不生成server-bundle进行服务端渲染的方案,在服务端打包的时候吧vue-server-renderer/server-plugin去掉了,要加上这个才会server-bundle.json文件

0
2
Jokcy
回复
蓝with黑
不管是否dev,你都应该把这个plugin加上
2018-06-25
共2条回复

Vue核心技术 Vue+Vue-Router+Vuex+SSR实战精讲

深入讲解Vue核心技术,展示Vue应用开发中的各种问题和解决方案

3168 学习 · 853 问题

查看课程