Unclear documentation

[jazoom]

Unclear documentation

[egoist]

which files certain code should be placed in

All the code should be in config file.

externals isn't documented in the config

Fixed.

[jazoom]

I'm still getting the error, though. I've confirmed that the value I put in externals is an array of dependency names.

Error: no such file or directory
   at MemoryFileSystem.readFileSync (/PROJECT_PATH/node_modules/memory-fs/lib/MemoryFileSystem.js:114:10)
   at devMiddleWare.waitUntilValid (/PROJECT_PATH/node_modules/vbuild/lib/server.js:31:24)
   at ready (/PROJECT_PATH/node_modules/webpack-dev-middleware/middleware.js:138:20)
   at Function.webpackDevMiddleware.waitUntilValid (/PROJECT_PATH/node_modules/webpack-dev-middleware/middleware.js:261:3)
   at app.get (/PROJECT_PATH/node_modules/vbuild/lib/server.js:30:19)
   at Layer.handle [as handle_request] (/PROJECT_PATH/node_modules/express/lib/router/layer.js:95:5)
   at next (/PROJECT_PATH/node_modules/express/lib/router/route.js:131:13)
   at Route.dispatch (/PROJECT_PATH/node_modules/express/lib/router/route.js:112:3)
   at Layer.handle [as handle_request] (/PROJECT_PATH/node_modules/express/lib/router/layer.js:95:5)
   at /PROJECT_PATH/node_modules/express/lib/router/index.js:277:22
   at param (/PROJECT_PATH/node_modules/express/lib/router/index.js:349:14)
   at param (/PROJECT_PATH/node_modules/express/lib/router/index.js:365:14)
   at Function.process_params (/PROJECT_PATH/node_modules/express/lib/router/index.js:410:3)
   at next (/PROJECT_PATH/node_modules/express/lib/router/index.js:271:10)
   at middleware (/PROJECT_PATH/node_modules/webpack-hot-middleware/middleware.js:26:48)
   at Layer.handle [as handle_request] (/PROJECT_PATH/node_modules/express/lib/router/layer.js:95:5)

[egoist]

Can you show me the exact config file? I tried externals: ['vue'] which is working for me.

[jazoom]

export default {
  title: 'title',
  template: 'index.html',
  resolve: true,
  target: 'node',
  cjs: true,
  externals: Object.keys(require('./package.json').dependencies),
  open: true,
  postcss: {
    use: ['lost', 'autoprefixer'],
    lost: {},
    autoprefixer: { browsers: ['last 2 versions'] },
    append: false
  },
  babel: {
    presets: [
      [require.resolve('babel-preset-es2015'), { modules: false }],
      require.resolve('babel-preset-stage-2')
    ]
  }
}

[egoist]

OK, I just found the reason, when one of cjs umd is set, we won't add html plugin for the dev server, since it's not a web app and you don't even need the dev server! When you opened the browser the dev server could not find ./dist/index.html so we met this error.

[egoist]

btw. I personally don't like setting open by default, it's always annoying. If you like you can manually call it as needed in command line: vbuild --dev --open

[jazoom]

Open is definitely annoying now that it closes the browser, but it didn't do that with the vue-cli template. The minor annoyance is that if you restart the dev server it opens another browser tab, but I find that less annoying than manually opening the tab every time I use the dev server.

[jazoom]

Oh okay. So I suppose I need to find a way to automatically use the dev server when I need hot reload then switch to using cjs and node target when building for production?

[egoist]

Why do you need hot reloading as well as cjs and node target?

[egoist]

If you're building server bundle and client bundle I guess you should use two config files.

Or try something like nuxt.js 🤔

[jazoom]

Well, I suppose the short answer is, I don't really know what I'm doing with Vue SSR. I've been developing this app for about 2 years in React and just recently converted it to Vue, so it's pretty complex and Nuxt.js doesn't fit with the requirements.

I'll try with 2 config files.