fix: resolve for global service

Author: yyx990803

packages/@vue/cli-plugin-eslint/index.js

@@ -11,7 +11,7 @@ module.exports = (api, { lintOnSave }) => {
             .end()
           .test(/\.(vue|jsx?)$/)
           .use('eslint-loader')
-            .loader('eslint-loader')
+            .loader(require.resolve('eslint-loader'))
             .options(Object.assign(options, {
               formatter: require('eslint/lib/formatters/codeframe')
             }))

packages/@vue/cli-plugin-typescript/index.js

@@ -24,11 +24,11 @@ module.exports = (api, options) => {
       // this is pending on the readiness of @babel/preset-typescript.
       tsRule
         .use('cache-loader')
-          .loader('cache-loader')
+          .loader(require.resolve('cache-loader'))
           .options({ cacheDirectory })
           .end()
         .use('babel-loader')
-          .loader('babel-loader')
+          .loader(require.resolve('babel-loader'))
 
       config.module
         .rule('vue')
@@ -41,19 +41,19 @@ module.exports = (api, options) => {
       if (api.hasPlugin('babel')) {
         tsRule
           .use('cache-loader')
-            .loader('cache-loader')
+            .loader(require.resolve('cache-loader'))
             .options({ cacheDirectory })
             .end()
           .use('babel-loader')
-            .loader('babel-loader')
+            .loader(require.resolve('babel-loader'))
       }
       tsRule
         .use('cache-loader-2')
-          .loader('cache-loader')
+          .loader(require.resolve('cache-loader'))
           .options({ cacheDirectory })
           .end()
         .use('ts-loader')
-          .loader('ts-loader')
+          .loader(require.resolve('ts-loader'))
           .options({
             transpileOnly: true,
             appendTsSuffixTo: [/\.vue$/]

packages/@vue/cli-service-global/lib/createConfigPlugin.js

@@ -19,10 +19,14 @@ module.exports = function createConfigPlugin (context, entry) {
           }
         }
 
-        // include resolve
+        // include resolve for deps of this module.
+        // when installed globally, the location may vary depending on
+        // package managers their folder structures for global install.
+        // so we first resolve the location of vue and then trace to the
+        // install location.
         config.resolve
           .modules
-            .add(path.resolve(__dirname, '../node_modules'))
+            .add(path.resolve(require.resolve('vue'), '../../../'))
 
         // set entry
         config

packages/@vue/cli-service/lib/config/base.js

@@ -44,14 +44,14 @@ module.exports = (api, options) => {
       .rule('vue')
         .test(/\.vue$/)
         .use('vue-loader')
-          .loader('vue-loader')
+          .loader(require.resolve('vue-loader'))
           .options(Object.assign({}, options.vueLoader))
 
     webpackConfig.module
       .rule('images')
         .test(/\.(png|jpe?g|gif)(\?.*)?$/)
         .use('url-loader')
-          .loader('url-loader')
+          .loader(require.resolve('url-loader'))
           .options({
             limit: 10000,
             name: `img/[name].[hash:8].[ext]`
@@ -63,7 +63,7 @@ module.exports = (api, options) => {
       .rule('svg')
         .test(/\.(svg)(\?.*)?$/)
         .use('file-loader')
-          .loader('file-loader')
+          .loader(require.resolve('file-loader'))
           .options({
             name: `img/[name].[hash:8].[ext]`
           })
@@ -72,7 +72,7 @@ module.exports = (api, options) => {
       .rule('media')
         .test(/\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/)
         .use('url-loader')
-          .loader('url-loader')
+          .loader(require.resolve('url-loader'))
           .options({
             limit: 10000,
             name: `media/[name].[hash:8].[ext]`
@@ -82,7 +82,7 @@ module.exports = (api, options) => {
       .rule('fonts')
         .test(/\.(woff2?|eot|ttf|otf)(\?.*)?$/)
         .use('url-loader')
-          .loader('url-loader')
+          .loader(require.resolve('url-loader'))
           .options({
             limit: 10000,
             name: `fonts/[name].[hash:8].[ext]`

packages/@vue/cli-service/lib/config/prod.js

@@ -194,7 +194,7 @@ module.exports = (api, options) => {
       //   .rule('vue')
       //     .use('thread-loader')
       //       .before('vue-loader')
-      //       .loader('thread-loader')
+      //       .loader(require.resolve('thread-loader'))
       //       .options({ name: 'vue' })
     }
   })