Vue项目发布具体步骤

一．把开发模式入口和产品模式入口区分开，建立两个入口文件。

二．在项目根目录下创建vue.config.js,用于配置不同环境下使用哪个入口文件。当使用npm run serve命令启动项目时，项目默认就处于开发模式(development)，当使用npm run build命令打包时，项目就处于产品模式(production)

三．通过external插件把核心模块抽出变为外部加载，减少项目体积，比如: vue,vuerouter,axios等

四．抽取elementui相关组件，引入elementui外部库文件和css文件

五．public/index.html文件中，引入的外部文件，在开发模式下，会引起项目运行错误，需要做判断，只有在产品模式下，这些引入的外部文件才能起作用。

六．路由模板的按需加载，通过babel的插件完成按需加载。

七．执行npm run build命令打包，会在项目根目录下生成dist目录，然后把dist目录部署到web服务器即可。

八．如果是部署到express服务器下，需要拷贝到/public下，然后在app.js中修改静态资源根目录为public/dist,如: app.use(express.static(path.join(__dirname, ‘public/dist’)));在浏览器中直接访问主机地址就行了。

九.使用pm2来管理服务器的运行

标签：文件,Vue,dist,项目,模式,发布,具体步骤,根目录,public
来源： https://blog.csdn.net/weixin_44440165/article/details/113599422