nuxt.js如何打包部署

发布于 2022-09-13 00:16:21 字数 2387 浏览 28 评论 0

新手接触vue,用纯vue开发,打包后把dist目录下的static目录和index.html上传到服务器,就可以通过axios请求接口数据了。

但是用nuxt后,不知道怎么样打包部署。
知道有三个命令:
npm run dev
npm run bulid
npm run generate

run dev知道是本地开发时候运行的开发模式,运行 npm run build后,dist目录下没有任何文件,倒是.nuxt目录下有dist目录,dist目录下有client目录和server目录,而client目录下只有一个fonts目录,一个img目录和一堆的js文件,没看到有index文件。

运行npm run generate后,项目根目录下的dist倒是有文件,但是是生成一堆的html文件,放在服务器后,倒是能打开,但是通过接口加载来的其他链接,打开后是404。

求大佬指教。

我使用的是ssr模式,nuxt.config.js里的是target: 'static'。使用php作为后端数据接口,请问怎样打包和部署。

以下是nuxt.config.js文件的内容,路由配有设置过,都是默认的。

export default {
  router:{
    base:"/" //此为根目录,如果有具体目录需求按实际情况写
  },
  // Target: https://go.nuxtjs.dev/config-target
  target: 'static',

  // Global page headers: https://go.nuxtjs.dev/config-head
  head: {
    title: '百度 - 让生活更美好',
    htmlAttrs: {
      lang: 'en'
    },
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: '我是百度' },
      { hid: 'keywords', name: 'keywords', content: '百度搜索' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ],
    script: [
      {src: 'http://res.wx.qq.com/open/js/jweixin-1.6.0.js'}
    ],
  },
  // Global CSS: https://go.nuxtjs.dev/config-css
  css: [
    'element-ui/lib/theme-chalk/index.css',
    '~assets/css/common.css',
    '~assets/css/font.css'
  ],

  // Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
  plugins: [
    '@/plugins/element-ui'
  ],

  // Auto import components: https://go.nuxtjs.dev/config-components
  components: true,

  // Modules for dev and build (recommended): https://go.nuxtjs.dev/config-modules
  buildModules: [
  ],

  // Modules: https://go.nuxtjs.dev/config-modules
  modules: [
    // https://go.nuxtjs.dev/axios
    '@nuxtjs/axios',
  ],

  // Axios module configuration: https://go.nuxtjs.dev/config-axios
  axios: {
    baseURL: 'http://api.edenw.com/index', // Used as fallback if no runtime config is provided
  },

  publicRuntimeConfig: {
    axios: {
      browserBaseURL: process.env.BROWSER_BASE_URL
    }
  },

  privateRuntimeConfig: {
    axios: {
      baseURL: process.env.BASE_URL
    }
  },

  // Build Configuration: https://go.nuxtjs.dev/config-build
  build: {
    transpile: [/^element-ui/],
  }
}

求大佬指教。

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

压抑⊿情绪 2022-09-20 00:16:21

如果是想做ssr,那就npm run build,然后npm start把项目服务起起来就行了,
如果只是想做静态页面,那就npm run generat,然后通过静态服务器部署

爱格式化 2022-09-20 00:16:21

楼主解决了吗

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文