style(prettier): add prettier config for trailing comma

Author: shadow81627

.eslintrc.js

@@ -1,3 +1,5 @@
+const prettierrc = require('./prettier.config.js');
+
 module.exports = {
   root: true,
   env: {
@@ -19,6 +21,7 @@ module.exports = {
   ],
   // add your custom rules here
   rules: {
-    'nuxt/no-cjs-in-config': 'off'
+    'nuxt/no-cjs-in-config': 'off',
+    'prettier/prettier': ['error', prettierrc],
   }
 }

ava.config.js

@@ -10,13 +10,13 @@ export default {
             root: ['.'],
             alias: {
               '@': '.',
-              '~': '.'
-            }
-          }
-        ]
-      ]
-    }
+              '~': '.',
+            },
+          },
+        ],
+      ],
+    },
   },
   tap: true,
-  verbose: true
-}
+  verbose: true,
+};

components/layout/last-modified.vue

@@ -16,12 +16,12 @@
 <script>
 export default {
   props: {
-    utc: Boolean
+    utc: Boolean,
   },
   computed: {
-    lastModified: () => (process.client ? document.lastModified : null)
-  }
-}
+    lastModified: () => (process.client ? document.lastModified : null),
+  },
+};
 </script>
 
 <style></style>

components/layout/the-footer.vue

@@ -47,18 +47,18 @@
 </template>
 
 <script>
-import lastModified from './last-modified'
+import lastModified from './last-modified';
 export default {
   components: {
-    lastModified
+    lastModified,
   },
   filters: {
-    shortHash: (value) => (value ? value.substring(0, 7) : null)
+    shortHash: (value) => (value ? value.substring(0, 7) : null),
   },
   data: () => ({
     version: process.env.VERSION,
     commit: process.env.COMMIT || process.env.TRAVIS_COMMIT,
-    utc: false
-  })
-}
+    utc: false,
+  }),
+};
 </script>

e2e.config.js

@@ -1,6 +1,6 @@
-import baseConfig from './ava.config.js'
+import baseConfig from './ava.config.js';
 
 export default {
   ...baseConfig,
-  files: ['test/e2e/**/*']
-}
+  files: ['test/e2e/**/*'],
+};

layouts/default.vue

@@ -94,32 +94,32 @@
 </template>
 
 <script>
-import TheFooter from '@/components/layout/the-footer.vue'
+import TheFooter from '@/components/layout/the-footer.vue';
 export default {
   components: {
-    TheFooter
+    TheFooter,
   },
   data() {
     return {
       dialog: false,
-      drawer: false
-    }
+      drawer: false,
+    };
   },
   computed: {
     items() {
-      return []
+      return [];
     },
     isDark() {
-      return false
+      return false;
       // return this.$store.getters.getCurrentTheme().dark;
-    }
+    },
   },
   head() {
     return {
       // link: [this.$store.getters.getCurrentTheme()],
-    }
-  }
-}
+    };
+  },
+};
 </script>
 
 <style>

nuxt.config.js

@@ -1,4 +1,4 @@
-const pkg = require('./package')
+const pkg = require('./package');
 
 module.exports = {
   mode: 'universal',
@@ -7,7 +7,7 @@ module.exports = {
     HOST: process.env.HOST,
     PORT: process.env.PORT,
     VERSION: pkg.version,
-    COMMIT: process.env.npm_package_gitHead
+    COMMIT: process.env.npm_package_gitHead,
   },
 
   /*
@@ -21,10 +21,10 @@ module.exports = {
       {
         hid: 'description',
         name: 'description',
-        content: process.env.npm_package_description || ''
-      }
+        content: process.env.npm_package_description || '',
+      },
     ],
-    link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }]
+    link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }],
   },
 
   /*
@@ -49,7 +49,7 @@ module.exports = {
     // Doc: https://github.com/nuxt-community/eslint-module
     '@nuxtjs/eslint-module',
     // Doc: https://github.com/nuxt-community/stylelint-module
-    '@nuxtjs/stylelint-module'
+    '@nuxtjs/stylelint-module',
   ],
 
   /*
@@ -63,7 +63,7 @@ module.exports = {
     '@nuxtjs/pwa',
     // Doc: https://github.com/nuxt-community/dotenv-module
     '@nuxtjs/dotenv',
-    '@nuxtjs/vuetify'
+    '@nuxtjs/vuetify',
   ],
 
   /*
@@ -82,9 +82,9 @@ module.exports = {
       'ButtonPlugin',
       'FormTextareaPlugin',
       'FormGroupPlugin',
-      'FormInputPlugin'
+      'FormInputPlugin',
     ],
-    directivePlugins: ['Tooltip']
+    directivePlugins: ['Tooltip'],
   },
 
   /*
@@ -101,9 +101,9 @@ module.exports = {
           enforce: 'pre',
           test: /\.(js|vue)$/,
           loader: 'eslint-loader',
-          exclude: /(node_modules)/
-        })
+          exclude: /(node_modules)/,
+        });
       }
-    }
-  }
-}
+    },
+  },
+};

pages/index.vue

@@ -25,13 +25,13 @@
 </template>
 
 <script>
-import Logo from '~/components/Logo.vue'
+import Logo from '~/components/Logo.vue';
 
 export default {
   components: {
-    Logo
-  }
-}
+    Logo,
+  },
+};
 </script>
 
 <style>

prettier.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  trailingComma: 'all',
+  arrowParens: 'always',
+  semi: true,
+  singleQuote: true,
+};

server/index.js

@@ -1,42 +1,42 @@
-const Koa = require('koa')
-const consola = require('consola')
-const { Nuxt, Builder } = require('nuxt')
+const Koa = require('koa');
+const consola = require('consola');
+const { Nuxt, Builder } = require('nuxt');
 
-const app = new Koa()
+const app = new Koa();
 
 // Import and Set Nuxt.js options
-const config = require('../nuxt.config.js')
-config.dev = app.env !== 'production'
+const config = require('../nuxt.config.js');
+config.dev = app.env !== 'production';
 
 async function start() {
   // Instantiate nuxt.js
-  const nuxt = new Nuxt(config)
+  const nuxt = new Nuxt(config);
 
   const {
     host = process.env.HOST || '127.0.0.1',
-    port = process.env.PORT || 3000
-  } = nuxt.options.server
+    port = process.env.PORT || 3000,
+  } = nuxt.options.server;
 
   // Build in development
   if (config.dev) {
-    const builder = new Builder(nuxt)
-    await builder.build()
+    const builder = new Builder(nuxt);
+    await builder.build();
   } else {
-    await nuxt.ready()
+    await nuxt.ready();
   }
 
   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)
-  })
+    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)
+  app.listen(port, host);
   consola.ready({
     message: `Server listening on http://${host}:${port}`,
-    badge: true
-  })
+    badge: true,
+  });
 }
 
-start()
+start();

stylelint.config.js

@@ -1,4 +1,4 @@
 module.exports = {
   // add your custom config here
   // https://stylelint.io/user-guide/configuration
-}
+};

test/ava.setup.js

@@ -1,16 +1,16 @@
-require('browser-env')()
-const hooks = require('require-extension-hooks')
-const Vue = require('vue')
+require('browser-env')();
+const hooks = require('require-extension-hooks');
+const Vue = require('vue');
 
-Vue.config.productionTip = false
+Vue.config.productionTip = false;
 
 // https://github.com/nuxt/create-nuxt-app/issues/180#issuecomment-463069941
-window.Date = global.Date = Date
+window.Date = global.Date = Date;
 
 hooks('vue')
   .plugin('vue')
-  .push()
+  .push();
 hooks(['vue', 'js'])
   .exclude(({ filename }) => filename.match(/\/node_modules\//))
   .plugin('babel')
-  .push()
+  .push();

test/e2e/index.js

@@ -1,29 +1,29 @@
-import { resolve } from 'path'
-import test from 'ava'
-import { Nuxt, Builder } from 'nuxt'
+import { resolve } from 'path';
+import test from 'ava';
+import { Nuxt, Builder } from 'nuxt';
 
 // We keep the nuxt and server instance
 // So we can close them at the end of the test
-let nuxt = null
+let nuxt = null;
 
 // Init Nuxt.js and create a server listening on localhost:4000
 test.before(async () => {
   const config = {
     dev: false,
-    rootDir: resolve(__dirname, '../../')
-  }
-  nuxt = new Nuxt(config)
-  await new Builder(nuxt).build()
-  await nuxt.server.listen(4000, 'localhost')
-}, 30000)
+    rootDir: resolve(__dirname, '../../'),
+  };
+  nuxt = new Nuxt(config);
+  await new Builder(nuxt).build();
+  await nuxt.server.listen(4000, 'localhost');
+}, 30000);
 
 // Example of testing only generated html
 test('Route / exits and render HTML', async (t) => {
-  const { html } = await nuxt.renderRoute('/', {})
-  t.true(html.includes('Documentation'))
-})
+  const { html } = await nuxt.renderRoute('/', {});
+  t.true(html.includes('Documentation'));
+});
 
 // Close server and ask nuxt to stop listening to file changes
 test.after('Closing server and nuxt.js', (t) => {
-  nuxt.close()
-})
+  nuxt.close();
+});

test/specs/Logo.spec.js

@@ -1,8 +1,8 @@
-import { mount } from '@vue/test-utils'
-import test from 'ava'
-import Logo from '@/components/Logo.vue'
+import { mount } from '@vue/test-utils';
+import test from 'ava';
+import Logo from '@/components/Logo.vue';
 
 test('is a Vue instance', (t) => {
-  const wrapper = mount(Logo)
-  t.is(wrapper.isVueInstance(), true)
-})
+  const wrapper = mount(Logo);
+  t.is(wrapper.isVueInstance(), true);
+});

unit.config.js

@@ -1,6 +1,6 @@
-import baseConfig from './ava.config.js'
+import baseConfig from './ava.config.js';
 
 export default {
   ...baseConfig,
-  files: ['test/specs/**/*']
-}
+  files: ['test/specs/**/*'],
+};