Как запустить производственный сайт после сборки vue cli

Я использую VueCLI 2 и строю как производство. построение.js построен и скомпилирован в 200KB. Когда я повторно запускаю сервер в качестве разработки, он загружается 3MB. Я уверен, что строение.JS внутри папки dist составляет 200 КБ. Я попытался открыть индекс.html, но он не работает и перенаправляется в корневой каталог на вебсайт.

пакета.в JSON

"scripts": {
  "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
  "build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
},

Webpack

module.exports = { ...
module:{
 ...
 plugins: [
  new webpack.ProvidePlugin({
    $: 'jquery',
    jquery: 'jquery',
    'window.jQuery': 'jquery',
    jQuery: 'jquery'
  })
 ],
 devtool: '#eval-source-map'
},
...
}

if (process.env.NODE_ENV === 'production') {
  module.exports.devtool = '#source-map'
  // http://vue-loader.vuejs.org/en/workflow/production.html
  module.exports.plugins = (module.exports.plugins || []).concat([
   new webpack.DefinePlugin({
    'process.env': {
     NODE_ENV: '"production"'
   }
  }),
  new webpack.optimize.UglifyJsPlugin({
    sourceMap: true,
    compress: {
     warnings: true
    }
  }),
  new webpack.LoaderOptionsPlugin({
    minimize: true
  }),
  new webpack.optimize.CommonsChunkPlugin({
    name: 'vendor',
    minChunks: function (module) {
      return module.context && module.context.indexOf('node_modules') !== -1;
    }
  })
 ])
}

HTML-код

<body>
  <script src="/dist/vendor.js"></script>
  <script src="/dist/main.js"></script>
</body>

команда

npm запустить сборку

npm запустить dev

6
node.js production-environment vue-cli vuejs2

2 ответов

npm run build создает build каталог с производственной сборкой вашего приложения.

для того, чтобы служить index.html в браузере вам нужен HTTP-сервер.

вы можете использовать любой сервер, который вы хотите, вот пример с служить :

npm install -g serve
serve -s dist
16

очень легко с express и очень расширяемым / конфигурируемым.

установить

npm install -D express

Compose

сервер.js

const express = require('express')
const app = express()
app.use(express.static('dist')) // absolute or relative to CWD
const port = 8080
app.listen(port, () => console.log(`Listening on port ${port}`))

выполнить

node server.js

2