精华内容
下载资源
问答
  • nuxt

    2021-01-24 18:39:04
    title: ‘nuxt-app’, htmlAttrs: { lang: ‘en’ }, meta: [ { charset: ‘utf-8’ }, { name: ‘viewport’, content: ‘width=device-width, initial-scale=1’ }, { hid: ‘description’, name:

    export default {
    // Global page headers: https://go.nuxtjs.dev/config-head
    head: {
    title: ‘nuxt-app’,
    htmlAttrs: {
    lang: ‘en’
    },
    meta: [
    { charset: ‘utf-8’ },
    { name: ‘viewport’, content: ‘width=device-width, initial-scale=1’ },
    { hid: ‘description’, name: ‘description’, content: ‘’ }
    ],
    link: [
    { rel: ‘icon’, type: ‘image/x-icon’, href: ‘/favicon.ico’ }
    ]
    },

    // Global CSS: https://go.nuxtjs.dev/config-css
    css: [
    ‘ant-design-vue/dist/antd.css’
    ],

    // Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
    plugins: [
    ‘@/plugins/antd-ui’,’@/plugins/components_dabao’,’@/plugins/axios’
    ],
    proxy: {
    ‘/api’: {
    target: ‘http://localhost:3001’, // 目标接口域名
    pathRewrite: {
    ‘^/api’: ‘/’, // 把 /api 替换成 /
    }
    }
    },

    // 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: [
    ‘@nuxtjs/axios’,’@nuxtjs/proxy’
    ],

    // Build Configuration: https://go.nuxtjs.dev/config-build
    build: {
    }
    }

    展开全文
  • Nuxt

    2020-06-09 10:25:45
    把Vue原本的dev开发模式改成Nuxt 修改Vue的代码,让Vue的mount前的生命周期在服务器端完成 这样改造后把本地的整个项目的代码包括node_modules一起移到服务器启动就行 迁移步骤 按官网的步骤来就行 // npx命令...

    框架原理

    • 把Vue原本的dev开发模式改成Nuxt
    • 修改Vue的代码,让Vue的mount前的生命周期在服务器端完成
    • 这样改造后把本地的整个项目的代码包括node_modules一起移到服务器启动就行

    迁移步骤

    • 按官网的步骤来就行
    // npx命令安装了Node就自带了
    npx create-nuxt-app <项目名>
    
    // 选择NodeJS框架 Koa
    // 选择UI框架
    // 选择测试框架
    // 完成
    
    • 配置文件
    // nuxt.config.js
    // 没有vue.config.js了
    
    // 这个文件用来配置服务器的端口
    // 渲染html页面的head标签数据,link,script,就是全局的css和js,都是用cdn地址
    // 还有css和plugins,注意文件路径
    
    module.exports = {
      mode: 'universal',
      server: {
        port: 8000,
        host: '127.0.0.1'
      },
      render: {
        csp: true
      },
      // axios的请求前缀,跟上面的port一致
      env: {
        baseUrl: 'http://127.0.0.1:8000'
      },
      router: {
        middleware: ['auth', 'i18n'],
        extendRoutes (routes, resolve) {
          routes.push({
            path: '/',
            redirect: {
              name: 'timeline-title'
            }
          })
        }
      },
      head: {
        title: 'title',
        meta: [
          { charset: 'utf-8' },
          { name: 'viewport', content: 'width=device-width,initial-scale=1,user-scalable=no,viewport-fit=cover' }
        ],
        link: [
          { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
        ],
        script: []
      },
      css: [
        '~/assets/css/reset.css',
        '~/assets/css/page-transition.css',
        '~/assets/scss/global.scss'
      ],
      plugins: [
        '~/plugins/axios.js',
        '~/plugins/request.js',
        '~/plugins/api.js',
        '~/plugins/vue-global.js'
      ],
      modules: [
        '@nuxtjs/axios',
        '@nuxtjs/style-resources',
        'cookie-universal-nuxt'
      ],
      axios: {
      },
      build: {
        babel: {
          plugins: [
            [
              "component",
              {
                "libraryName": "element-ui",
                "styleLibraryName": "theme-chalk"
              }
            ]
          ],
        },
        extend (config, ctx) {
        }
      }
    }
    
    • Nuxt的路由
    // 把 <router-link to="/">首页</router-link> 改成
    <nuxt-link to="/">首页</nuxt-link>
    // 用$router跳转的就不用改了
    
    // Nuxt是没有vue-router的
    // 他的路由是用文件路径生成的,比如
    pages/
    --| _slug/
    -----| index.vue
    --| users/
    -----| _id.vue // 注意这里是下划线
    --| index.vue
    // 生成
    router: {
      routes: [
        {
          name: 'index',
          path: '/',
          component: 'pages/index.vue'
        },
        {
          name: 'users-id',
          path: '/users/:id?',
          component: 'pages/users/_id.vue'
        },
        {
          name: 'slug',
          path: '/:slug',
          component: 'pages/_slug/index.vue'
        }
      ]
    }
    
    • Nuxt的app.vue
    // 以前的app.vue是  <router-view />
    // 现在是在layouts/xx.vue自定义的
    // 默认有一个叫default.vue
    // 内容显示在 <nuxt /> 里
    
    // 如果文件里没有error.vue,需要自己写一个,就随便写一个,写上404就行
    // 那指定哪个layout在哪配置呢,往下看
    
    • Vue文件的修改
    // 在原来的Vue的属性和方法的基础上,添加了下面的熟悉和方法
    // 这些方法是用在渲染的时候的
    
    // asyncData,最重要的一个键, 支持 异步数据处理,另外该方法的第一个参数为当前页面组件的 上下文对象。
    // head,配置当前页面的 Meta 标签, 详情参考 页面头部配置API。
    // layout,指定当前页面使用的布局(layouts 根目录下的布局文件)。详情请参考 关于 布局 的文档。
    // loading,如果设置为false,则阻止页面自动调用加载提示
    // transition,指定页面切换的过渡动效, 详情请参考 页面过渡动效。
    // scrollToTop,布尔值,默认: false。 用于判定渲染页面前是否需要将当前页面滚动至顶部。这个配置用于 嵌套路由的应用场景。
    // validate,校验方法用于校验 动态路由的参数。
    // middleware,指定页面的中间件,中间件会在页面渲染之前被调用, 请参考 路由中间件
    
    // 放一个例子
    // 这个方法需要主动调用,等于是自定义生命周期函数,而且必须是这个名字
    // 这个方法代替了vue的 beforeCreate 和 created 两个生命周期
    // mounted 还是在客户端执行,mounted不应该写数据请求,防止重复请求
    // 结构参数,app是this实例,params是请求的url,store是vuex实例
    async asyncData({ app, params, store }) {
      // 可以在asyncData获取和修改store
      // 往下看可以发现这个categoryList的数据是来自validate的
      let categoryList = store.state.category.recommendCategoryList
      categoryList[0].name = "text";
      store.commit('category/UPDATE_TIMELINE_CATEGORY_LIST', categoryList)
      
      // 作者榜单
      let res = await app.$api.getAuthorRank({
        channel: params.name,
        after: '',
        first: 20
      }).then(res => res.s === 1 ? res.d : {})
      return {
        categoryList,
        authors: res.edges,
        pageInfo: res.pageInfo
      }
    },
    head() {
      return {
        title: this.pageInfo.name || 'xxx'
      }
    },
    async validate ({ app, params, store }) {
      // validate是执行在asyncData之前的 
      // 可以在validate获取和修改store
      if (params.id && params.id != 'undefined') {
        let categoryList = []
        // 获取分类列表缓存
        if (store.state.category.timelineCategoryList.length) {
          categoryList = store.state.category.timelineCategoryList
        } else {
          categoryList = await app.$api.getCategories().then(res => res.s === 1 ? initCategoryList.concat(res.d.categoryList) : initCategoryList)
          store.commit('category/UPDATE_TIMELINE_CATEGORY_LIST', categoryList)
        }
        return true
      }
      return false
    },
    // 下面就是原Vue的老代码
    data() {
      return {
        pinDetail: {},
        page: 1,
        comments: []
      }
    },
    ...
    
    • 上面我们使用了vuex
    // 但是为什么在nuxt.config.js的plugins里没有看到引入
    // 因为nuxt自带了,只要项目里有个store的文件夹
    // 放入js就行,js里是函数型的state 和 同步的mutations
    
    // text.js
    export const state = () => ({
      isTopbarBlock: true, // 顶部栏是否显示
    })
    
    export const mutations = {
      UPDATE_TOPBAR_BLOCK(state, payload){
        state.isTopbarBlock = payload
      }
    }
    
    // 在page的validate里用commit执行
    store.commit('文件名/UPDATE_TOPBAR_BLOCK', 参数)
    
    • 请求三人组
    // Nuxt不能用正常的axios,一定要用@nuxtjs/axios,他默认让vue.$axios = axios
    // 还有cookie-universal-nuxt插件,这个插件默认让vue.$cookie = 请求用户的cookie
    
    // plugins/axios.js,对axios进行配置
    export default function ({ app: { $axios, $cookies } }) {	 
       $axios.defaults.baseURL = process.env.baseUrl
       $axios.defaults.timeout = 30000
       $axios.interceptors.request.use(config => {
    	config.headers['X-Token'] = $cookies.get('token') || ''
    	config.headers['X-Device-Id'] = $cookies.get('clientId') || ''
    	config.headers['X-Uid'] = $cookies.get('userId') || ''
    	return config
       })
       $axios.interceptors.response.use(response => {
    	if (/^[4|5]/.test(response.status)) {
    	   return Promise.reject(response.statusText)
    	}
    	   return response.data
       })
    }
    
    // plugins/request.js
    export default ({ app: { $axios } }, inject) => {
      let requestList = {}
      let methods = ['get', 'post', 'put', 'delete']
      methods.forEach(method => {
        let dataKey = method === 'get' ? 'params' : 'data'
        requestList[method] = function(url, data) {
          return $axios({
            method,
            url,
            [dataKey]: data
          }).catch(err => {
            console.error(err)
            return {
              s: 0,
              d: {},
              errors: [err]
            }
          })
        }
      })
      inject('request', requestList)
    }
    
    // plugins/api.js
    export default ({ app: { $request } }, inject) => {
      inject('api', {
        /**
         * 登录验证
         * @param {string} password - 密码
         * @param {string} phoneNumber - 手机号码
         */
        loginAuth(data) {
          return $request.post('/v1/auth/login', data)
        },
        /**
         * 身份验证
         */
        isAuth() {
          return $request.get('/v1/auth/authentication')
        }
        ...
      })
    }
    
    • Vue全局设置
    // plugin/vue.global.js
    
    // 在这里配置一些组件和过滤器
    import Vue from 'vue'
    import xxx from '~/components/xxx'
    import utils from '~/utils/utils'
    
    Vue.use(xxx)
    
    Vue.filter('formatTime', d => utils.formatTime(d))
    
    export default function (context, inject) {
      inject('utils', utils)
    }
    
    • 服务器搭建,这里用Koa
    // server/index.js
    
    const fs = require('fs')
    const Koa = require('koa')
    const cors = require('koa2-cors')
    const helmet = require('koa-helmet')
    const Router = require('koa-router')
    const bodyParser = require('koa-bodyparser')
    const consola = require('consola')
    const { Nuxt, Builder } = require('nuxt')
    const app = new Koa()
    const router = new Router()
    
    // Import and Set Nuxt.js options
    const config = require('../nuxt.config.js')
    config.dev = app.env !== 'production'
    
    function useMiddleware(){
      app.use(helmet())
      app.use(bodyParser())
      //设置全局返回头
      app.use(cors({
        origin: function(ctx) {
          return 'http://localhost:8000'; //cors
        },
        exposeHeaders: ['WWW-Authenticate', 'Server-Authorization'],
        maxAge: 86400,
        credentials: true,  // 允许携带头部验证信息
        allowMethods: ['GET', 'POST', 'PUT', 'DELETE', 'HEAD', 'OPTIONS'],
        allowHeaders: ['Content-Type', 'Authorization', 'Accept', 'X-Token', 'X-Device-Id', 'X-Uid'],
      }))
    }
    
    function useRouter(path){
      // 路由就是接口,这里怎么配置就不写了
    }
    
    async function start () {
      // Instantiate nuxt.js
      const nuxt = new Nuxt(config)
    
      const {
        host = process.env.HOST || '127.0.0.1',
        port = process.env.PORT || 3000
      } = nuxt.options.server
    
      await nuxt.ready()
      // Build in development
      if (config.dev) {
        const builder = new Builder(nuxt)
        await builder.build()
      }
      useMiddleware()
      useRouter()
      app.use((ctx) => {
        ctx.status = 200
        ctx.respond = false // Bypass Koa's built-in response handling
        ctx.req.ctx = ctx // This might be useful later on, e.g. in nuxtServerInit or with nuxt-stash
        nuxt.render(ctx.req, ctx.res)
      })
      app.listen(port, host)
    }
    
    start()
    
    • 到这里就大致都改好了,看看Nuxt的命令有哪些
    "scripts": {
      "dev": "cross-env NODE_ENV=development nodemon --inspect server/index.js --watch server",
      "build": "nuxt build",
      "start": "nuxt start",
      "generate": "nuxt generate",
      "lint": "eslint --ext .js,.vue --ignore-path .gitignore ."
    },
    
    • 执行npm run dev,会打包出一个.nuxt文件,顺便打开服务器,直接访问就行,如果要放到服务器,就把所有的代码移到服务器,同样的方法启动就行

    研究一下.nuxt文件

    // router.js,这个就是上面说到的自动生成的路由文件
    // App.js,就是读取layouts文件夹生成出来的模板文件
    
    // index.js,这个非常值得研究
    // index.js把nuxt.config.js里的配置读取后生成出来的
    // 最开始可以看到很多的plugins
    // 然后引入可很多的component
    // 还有一个inject方法,这个方法在上面的请求三人组里可以看到很多次,就是在这里调用的,是一个固定写法,用来给Vue实例注册$xx属性的,看代码
    
    const inject = function (key, value) {
      if (!key) {
        throw new Error('inject(key, value) has no key provided')
      }
      if (value === undefined) {
        throw new Error(`inject('${key}', value) has no value provided`)
      }
      key = '$' + key
      // Add into app
      app[key] = value
    }
    
    // server.js,这个就是服务器渲染的核心
    // 在这里把请求的路径解析后,知道请求的是哪个页面的路由,然后读取文件,看代码
    export default async (ssrContext) => {
      
      ssrContext.redirected = false
      ssrContext.next = createNext(ssrContext)
      ssrContext.beforeRenderFns = []
      ssrContext.nuxt = { layout: 'default', data: [], fetch: [], error: null, state: null, serverRendered: true, routePath: '' }
    
      const { app, router, store } = await createApp(ssrContext)
      const _app = new Vue(app)
    
      ssrContext.nuxt.routePath = app.context.route.path
      ssrContext.meta = _app.$meta()
      ssrContext.asyncData = {}
    
      const beforeRender = async () => {
        await Promise.all(ssrContext.beforeRenderFns.map(fn => promisify(fn, { Components, nuxtState: ssrContext.nuxt })))
        ssrContext.rendered = () => {
          ssrContext.nuxt.state = store.state
        }
      }
    
      /*
      ** Set layout
      */
      let layout = Components.length ? Components[0].options.layout : NuxtError.layout
      if (typeof layout === 'function') {
        layout = layout(app.context)
      }
      await _app.loadLayout(layout)
      if (ssrContext.nuxt.error) {
        return renderErrorPage()
      }
      layout = _app.setLayout(layout)
      ssrContext.nuxt.layout = _app.layoutName
    
      // asyncDatas非常的核心
      const asyncDatas = await Promise.all(Components.map((Component) => {
        const promises = []
    
        if (Component.options.asyncData && typeof Component.options.asyncData === 'function') {
          const promise = promisify(Component.options.asyncData, app.context)
          promise.then((asyncDataResult) => {
            ssrContext.asyncData[Component.cid] = asyncDataResult
            applyAsyncData(Component)
            return asyncDataResult
          })
          promises.push(promise)
        } else {
          promises.push(null)
        }
    
        // Call fetch(context)
        if (Component.options.fetch && Component.options.fetch.length) {
          promises.push(Component.options.fetch(app.context))
        } else {
          promises.push(null)
        }
    
        return Promise.all(promises)
      }))
    
      await beforeRender()
    
      return _app
    }
    

    如果有必须使用的js,但不需要在服务端使用的js

    • 比如mavon-editor
    // nuxt.config.js 中添加plugins配置
    plugins: [
      ...
      { src: '@/plugins/vue-mavon-editor', ssr: false }
    ],
    
    
    // 在页面或者组件中引入套上<no-ssr>
    <template>
      <div class="mavonEditor">
        <no-ssr>
          <mavon-editor :toolbars="markdownOption" v-model="handbook"/>
        </no-ssr>
      </div>
    </template>
    

    我还是不会用怎么办
    把上面的github下载下来,没用的代码删了,改成自己的就行

    展开全文
  • <div><p>Is there a way to have Nuxt Components auto import components that are referenced in the content files that Nuxt Content processes? If not, what's a good strategy for dynamically importing...
  • <p>at the moment, the terms <strong>Nuxt.js, <strong>Nuxt</strong> and <strong>NuxtJS</strong> are not used consistently, nor they are "explained" somewhere. <p>From my current understanding, ...
  • Nuxt启动器 Nuxt入门个人 产品特点 Nuxt 2 Babel 7或带有Vue类组件的TypeScript Sass安装 漂亮,ESLint和Stylelint 使用@ vue / test-utils和Jest进行单元测试 赛普拉斯的E2E测试 与tota11y的辅助功能检查 默认...
  • realworld-nuxt:realworld的nuxt实现
  • nuxt-app:nuxt-app优惠
  • nuxt基础xmind

    2021-01-18 16:57:12
    nuxt基础xmind
  • nuxt-twicpics 与Nuxt集成 设置 将@twicpics/nuxt依赖项添加到您的项目中 yarn add @twicpics/nuxt -D # or npm install @twicpics/nuxt --save-dev 添加@twicpics/nuxt到modules的部分nuxt.config.js { modules...
  • Nuxt support

    2021-01-11 01:10:25
    <div><p>Is it possible to add nuxt support or <code>TypeScript-Nuxt-Starter</code>. I could not manage to use nuxt 2 with typescript successfully. <p>Many thanks.</p><p>该提问来源于开源项目:...
  • Nuxt教程

    千次阅读 2018-11-29 10:00:07
    Nuxt对webpack和vue布局高度封装了,使用官方提供的creat-nuxt-app可以一键生成一个nuxt项目 其中的路由,node-sass 加载器器都已封装进去,无需配置什么就可以直接写 layout是项目的最外层布局, 对于动态路...

    https://zh.nuxtjs.org/guide
    Nuxt是根据React框架的Next框架衍生而来的.框架是为了解决Vue SSR的难题,

    Nuxt对webpack和vue布局高度封装了,使用官方提供的creat-nuxt-app可以一键生成一个nuxt项目

    其中的路由,node-sass 加载器器都已封装进去,无需配置什么就可以直接写

    layout是项目的最外层布局,

    对于动态路由要使用_+'参数名'的文件名方式来运作 官方上有详细的文档介绍.https://zh.nuxtjs.org/guide/routing#%E5%8A%A8%E6%80%81%E8%B7%AF%E7%94%B1

     

    Nuxt支持自定义content key 这对于网站的SEO是很好的.

     

    展开全文
  • Nuxt Context

    2020-11-27 22:02:43
    I would like to use this library together with Nuxt. I tried, but the only issue I'm having is that <code>this</code> does not include the Nuxt <code>context</code>. I specifically need it so i ...
  • nuxtjs博客 Nuxt.js的说明
  • <div align="right"><em>This bug report is available on <a href="https://cmty.app/nuxt">Nuxt</a> community (<a href="https://cmty.app/nuxt/apollo-module/issues/c320">#c320)</em></div>该提问来源于开源...
  • nuxt-module:一个NuxtJS模块,封装了每个nuxt存储库的所有必需组件
  • 真实世界-nuxtjs 一个nuxtjs案例
  • nuxt-app:Nuxt应用-源码

    2021-04-19 18:07:00
    nuxt应用 构建设置 # install dependencies $ npm install # serve with hot reload at localhost:3000 $ npm run dev # build for production and launch server $ npm run build $ npm run start # generate ...
  • 无服务器Nuxt插件 带有无服务器框架的AWS(Lambda + S3)上的Nuxt。 演示版 安装 使用npm install命令完成npm install : npm i serverless-nuxt npm i serverless serverless-nuxt-plugin -D 查看以设置您的...
  • Nuxt.js 我所有的个人Nuxt.js项目 专案 :rocket: 使用Nuxt.js的第一步
  • nuxt-socket-io 客户端和服务器模块 特征 多个IO插座的组态 每个套接字名称空间的配置 IO服务器自动注册 套接字IO状态 自动错误处理 调试日志记录,通过将localStorage项目“ debug”设置为“ nuxt-socket-io”启用...
  • Nuxt generate

    2020-12-04 15:48:19
    <div align="right"><em>This bug report is available on <a href="https://cmty.app/nuxt">Nuxt</a> community (<a href="https://cmty.app/nuxt/nuxt-i18n/issues/c181">#c181)</em></div>该提问来源于开源项目&#...
  • Nuxt.js模块,用于tailvue组件 这需要带有模块的 快速设置 将nuxt-tailvue依赖项添加到您的Nuxt.js项目中 npm install nuxt-tailvue # OR yarn add nuxt-tailvue 添加nuxt-tailvue到modules的部分nuxt.config.js ...
  • 因此,该lib不适用于最新版本的Eggjs和Nuxtjs。 所以我在这里创建了一个新的库。 依赖描述 依赖版本 版 蛋 纳克斯特 2.x :beaming_face_with_smiling_eyes: :cross_mark: 1.x :cross_mark: :beaming_face_...
  • nuxt博客-源码

    2021-02-18 09:39:53
    nuxt博客
  • 安装nuxt_nginx部署nuxt

    2021-01-13 15:48:27
    1.nuxt项目package.json的scripts字段配置 以下是mac os的配置"dev": "nuxt", "build": "nuxt build", "start:dev": "NODE_ENV=development nuxt start --port 3001", "start": "nuxt start --port 3000", 如果是...

    a19c8d5e7b36992dd8ea994156ef54b7.png

    1.nuxt项目package.json的scripts字段配置

    以下是mac os的配置
    "dev": "nuxt",
    "build": "nuxt build",
    "start:dev": "NODE_ENV=development nuxt start --port 3001",
    "start": "nuxt start --port 3000",
    如果是windows os则安装cross-env模块
    "dev": "nuxt",
    "build": "nuxt build",
    "start:dev": "cross-env NODE_ENV=development nuxt start --port 3001",
    "start": "nuxt start --port 3000",

    2.nginx配置

    路径:/etc/nginx/nginx.conf

    主要参考以下server字段

    server_name要写自己的域名
    #user  nobody;
    worker_processes  1;
    #error_log  logs/error.log;
    #error_log  logs/error.log  notice;
    #error_log  logs/error.log  info;
    #pid  logs/nginx.pid;
    events {
      worker_connections  1024;
    }
    http {
      include       mime.types;
      default_type  application/octet-stream;
      sendfile        on;
      keepalive_timeout  65;
      #gzip  on;
        server {
            listen       80;
            server_name  xxxx.com www.xxxx.com;
            location / {
                    proxy_redirect off;
                    proxy_set_header Host               $host;
                    proxy_set_header X-Real-IP          $remote_addr;
                    proxy_set_header X-Forwarded-For    $proxy_add_x_forwarded_for;
                    proxy_set_header X-Forwarded-Proto  $scheme;
                    proxy_read_timeout          1m;
                    proxy_connect_timeout       1m;
                    proxy_pass                          http://127.0.0.1:3000; # 监听node 3000端口即正式环境
            }
        }
      server {
          listen       80;
          server_name  test.xxxx.com www.test.xxxx.com;
          location / {
              proxy_redirect off;
              proxy_set_header Host               $host;
              proxy_set_header X-Real-IP          $remote_addr;
              proxy_set_header X-Forwarded-For    $proxy_add_x_forwarded_for;
              proxy_set_header X-Forwarded-Proto  $scheme;
              proxy_read_timeout          1m;
              proxy_connect_timeout       1m;
              proxy_pass                          http://127.0.0.1:3001; # 监听node 3001端口即测试环境
          }
          error_page   500 502 503 504  /50x.html;
          location = /50x.html {
              root   html;
          }
      }
    }

    配置好后重启nginx(下面有教程)

    3.上传相关文件到服务器

    1.打包

    npm run build

    2.上传

    62ed49c1301c2ea25d599398bd5b0f8d.png

    4.pm2开启node服务

    进入上传目录,然后再执行以下命令

    npm i
    npm i pm2 -g
    pm2 start npm --name "prod" -- run start
    pm2 start npm --name "test" -- run start:dev

    5.面板监听

    进入https://keymetrics.pm2.io/ 按照指示在服务器执行

    pm2 link xxx xxx

    072e73164d31634ab9f67f6e580691fe.png

    6.其他有用的命令

    查看nginx开放的端口

    sudo netstat -anp | grep nginx

    强制关闭nginx

    pkill -9 nginx

    重启nginx

    sudo nginx -s reload

    删除文件夹/文件

    rm -rf

    get到的童鞋点个赞吧 -_-/

    展开全文
  • Laravel-Nuxt Laravel-Nuxt入门项目模板。 产品特点 Nuxt 2 Laravel 8 SPA或SSR 社交名流整合 VueI18n + ESlint + Bootstrap 4 +真棒字体5 登录,注册,电子邮件验证和密码重置 安装 composer create-project -...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 12,326
精华内容 4,930
热门标签
关键字:

nuxt