Merge pull request #1 from sumcumo/feat/updating_eslint

Updates

Author: svewag

generator/index.js

@@ -6,7 +6,7 @@ const chalk = require('chalk')
 
 module.exports = (api, options, rootOptions) => {
   if (!api.hasPlugin('router')) {
-    throw new Error(`Please install router plugin with 'vue add router'.`)
+    throw new Error('Please install router plugin with \'vue add router\'.')
   }
 
   api.extendPackage({
@@ -42,16 +42,16 @@ module.exports = (api, options, rootOptions) => {
       const file = getFile(api, './src/main.js')
       if (file) {
         let contents = fs.readFileSync(file, { encoding: 'utf8' })
-        contents = contents.replace(/import router from ('|")\.\/router(\.\w+)?('|")/, `import { createRouter } from $1./router$3`)
-        contents = contents.replace(/import store from ('|")\.\/store(\.\w+)?('|")/, `import { createStore } from $1./store$3`)
-        contents = contents.replace(/import ('|")\.\/registerServiceWorker('|")\n/, ``)
-        contents = contents.replace(/const apolloProvider = createProvider\(({(.|\s)*?})?\)\n/, ``)
+        contents = contents.replace(/import router from ('|")\.\/router(\.\w+)?('|")/, 'import { createRouter } from $1./router$3')
+        contents = contents.replace(/import store from ('|")\.\/store(\.\w+)?('|")/, 'import { createStore } from $1./store$3')
+        contents = contents.replace(/import ('|")\.\/registerServiceWorker('|")\n/, '')
+        contents = contents.replace(/const apolloProvider = createProvider\(({(.|\s)*?})?\)\n/, '')
         contents = contents.replace(/new Vue\({((.|\s)*)}\)\.\$mount\(.*?\)/, `export async function createApp ({
           beforeApp = () => {},
           afterApp = () => {}
         } = {}) {
           const router = createRouter()
-          ${templateOptions.vuex ? `const store = createStore()` : ''}
+          ${templateOptions.vuex ? 'const store = createStore()' : ''}
           ${templateOptions.apollo ? `const apolloProvider = createProvider({
             ssr: process.server,
           })` : ''}
@@ -87,7 +87,7 @@ module.exports = (api, options, rootOptions) => {
         let contents = fs.readFileSync(file, { encoding: 'utf8' })
         contents = contents.replace(/export default new Router\({((.|\s)+)}\)/, `export function createRouter () {
           return new Router({
-            ${contents.includes('mode:') ? '' : `mode: 'history',`}$1})
+            ${contents.includes('mode:') ? '' : 'mode: \'history\','}$1})
         }`)
         contents = contents.replace(/mode:\s*("|')(hash|abstract)("|'),/, '')
         fs.writeFileSync(file, contents, { encoding: 'utf8' })
@@ -126,7 +126,7 @@ module.exports = (api, options, rootOptions) => {
         contents = contents.replace(/export default app => {((.|\s)*)}/, `export default app => {$1
           ssrMiddleware(app, { prodOnly: true })
         }`)
-        contents = `import ssrMiddleware from '@akryum/vue-cli-plugin-ssr/lib/app'\n` + contents
+        contents = 'import ssrMiddleware from \'@akryum/vue-cli-plugin-ssr/lib/app\'\n' + contents
         fs.writeFileSync(file, contents, { encoding: 'utf8' })
       }
 

generator/templates/default/src/entry-client.js

@@ -1,3 +1,6 @@
+<%_ if (apollo) { _%>
+import 'isomorphic-fetch'
+  <%_ } _%>
 import { loadAsyncComponents } from '@akryum/vue-cli-plugin-ssr/client'
 <%_ if (pwa) { _%>
 import './registerServiceWorker'
@@ -14,13 +17,16 @@ createApp({
 
   afterApp ({
     app,
+    router,
     <%_ if (vuex) { _%>
       store,
     <%_ } _%>
   }) {
     <%_ if (vuex) { _%>
     store.replaceState(window.__INITIAL_STATE__)
     <%_ } _%>
-    app.$mount('#app')
+    router.onReady(() => {
+      app.$mount('#app')
+    })
   }
 })

lib/dev-server.js

@@ -5,7 +5,7 @@ const chalk = require('chalk')
 
 const config = require('./config')
 
-module.exports.setupDevServer = ({ server, templatePath, onUpdate }) => new Promise((resolve, reject) => {
+module.exports.setupDevServer = ({ server, templatePath, onUpdate, webpackConfig }) => new Promise((resolve, reject) => {
   const service = config.service
   if (!service) {
     reject(new Error('No cli-service available. Make sure you ran the command with `vue-cli-service`.'))
@@ -20,7 +20,7 @@ module.exports.setupDevServer = ({ server, templatePath, onUpdate }) => new Prom
   }
 
   const { getWebpackConfigs } = require('./webpack')
-  const [clientConfig, serverConfig] = getWebpackConfigs(service)
+  const [clientConfig, serverConfig] = getWebpackConfigs(service, webpackConfig)
 
   let serverBundle
   let template
@@ -126,7 +126,7 @@ module.exports.setupDevServer = ({ server, templatePath, onUpdate }) => new Prom
 
     setTimeout(() => {
       console.log()
-      console.log(`  App running at:`)
+      console.log('  App running at:')
       console.log(`  - Local:   ${chalk.cyan(url)} ${copied}`)
     })
   }

lib/loaders/css-context.js

@@ -27,23 +27,23 @@ module.exports.pitch = function (remainingRequest) {
 
   if (isServer && isProduction) {
     const shared = [
-      `// load the styles`,
+      '// load the styles',
       `var content = require(${request});`,
       // content list format is [id, css, media, sourceMap]
-      `if(typeof content === 'string') content = [[module.id, content, '']];`,
-      `module.exports = content;`,
-      `if(content.locals) module.exports = content.locals;`,
+      'if(typeof content === \'string\') content = [[module.id, content, \'\']];',
+      'module.exports = content;',
+      'if(content.locals) module.exports = content.locals;',
     ]
     // on the server: attach to Vue SSR context
     if (isVue) {
       // inside *.vue file: expose a function so it can be called in
       // component's lifecycle hooks
       return shared.concat([
-        `// add CSS to SSR context`,
+        '// add CSS to SSR context',
         `var add = require(${addStylesServerPath}).default`,
-        `module.exports.__inject__ = function (context) {`,
+        'module.exports.__inject__ = function (context) {',
         `  add(${id}, content, ${isProduction}, context)`,
-        `};`,
+        '};',
       ]).join('\n')
     } else {
       // normal import

lib/server.js

@@ -5,6 +5,7 @@ exports.createServer = ({
   port,
   host,
 }) => {
+  /* eslint-disable-next-line no-async-promise-executor */
   return new Promise(async (resolve, reject) => {
     const app = express()
 

lib/webpack.js

@@ -43,24 +43,26 @@ exports.chainWebpack = (webpackConfig) => {
   // HTML
   webpackConfig.plugin('html-filter').use(HtmlFilterPlugin)
   if (isProd) {
+    // TODO Make customizable from outside
     webpackConfig.plugin('html').tap(args => {
       args[0].minify.removeComments = false
+      args[0].minify.caseSensitive = true
       return args
     })
   }
 
   webpackConfig.entry('app').clear().add(config.entry(target))
 
   webpackConfig.plugin('define').tap(args => {
-    return [Object.assign(args[0], {'process.client': target === 'client', 'process.server': target === 'server'})]
+    return [Object.assign(args[0], { 'process.client': target === 'client', 'process.server': target === 'server' })]
   })
 
   webpackConfig.stats(isProd ? 'normal' : 'none')
   webpackConfig.devServer.stats('errors-only').quiet(true).noInfo(true)
 
   if (isClient) {
     webpackConfig.plugin('ssr').use(VueSSRClientPlugin)
-    webpackConfig.plugin('loader').use(WebpackBar, [{name: 'Client', color: 'green'}])
+    webpackConfig.plugin('loader').use(WebpackBar, [{ name: 'Client', color: 'green' }])
 
     webpackConfig.devtool(!isProd ? '#cheap-module-source-map' : undefined)
 
@@ -70,10 +72,10 @@ exports.chainWebpack = (webpackConfig) => {
     })
   } else {
     webpackConfig.plugin('ssr').use(VueSSRServerPlugin)
-    webpackConfig.plugin('loader').use(WebpackBar, [{name: 'Server', color: 'orange'}])
+    webpackConfig.plugin('loader').use(WebpackBar, [{ name: 'Server', color: 'orange' }])
 
     webpackConfig.devtool('source-map')
-    webpackConfig.externals(nodeExternals({whitelist: config.nodeExternalsWhitelist}))
+    webpackConfig.externals(nodeExternals({ whitelist: config.nodeExternalsWhitelist }))
     webpackConfig.output.libraryTarget('commonjs2'); webpackConfig.target('node')
     webpackConfig.optimization.splitChunks(false).minimize(false)
 

package.json

@@ -50,12 +50,12 @@
     "webpackbar": "^2.6.3"
   },
   "devDependencies": {
-    "eslint": "^4.13.1",
-    "eslint-config-standard": "^11.0.0",
+    "eslint": "^6.2.1",
+    "eslint-config-standard": "^14.0.1",
     "eslint-plugin-import": "^2.13.0",
-    "eslint-plugin-node": "^7.0.1",
-    "eslint-plugin-promise": "^3.8.0",
-    "eslint-plugin-standard": "^3.1.0",
+    "eslint-plugin-node": "^9.1.0",
+    "eslint-plugin-promise": "^4.2.1",
+    "eslint-plugin-standard": "^4.0.1",
     "vuepress": "^0.14.8"
   },
   "peerDependencies": {

ui.js

@@ -15,21 +15,21 @@ module.exports = api => {
 
   api.describeTask({
     match: /vue-cli-service ssr:serve --mode production/,
-    description: `Starts the included HTTP server for SSR in production`,
+    description: 'Starts the included HTTP server for SSR in production',
     link: 'https://github.com/Akryum/vue-cli-plugin-ssr#usage',
     ...taskCommon,
   })
 
   api.describeTask({
     match: /vue-cli-service ssr:serve/,
-    description: `Compiles and hot-reloads for development with SSR`,
+    description: 'Compiles and hot-reloads for development with SSR',
     link: 'https://github.com/Akryum/vue-cli-plugin-ssr#usage',
     ...taskCommon,
   })
 
   api.describeTask({
     match: /vue-cli-service ssr:build/,
-    description: `Compiles and minifies for production with SSR`,
+    description: 'Compiles and minifies for production with SSR',
     link: 'https://github.com/Akryum/vue-cli-plugin-ssr#usage',
   })
 }