refactor(ui): use RDN on webpack client addon

octref · Jun 21, 2018 · 46dd855 · 46dd855
1 parent 77fc6d9
commit 46dd855
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 12 deletions.
diff --git a/packages/@vue/cli-ui-addon-webpack/src/main.js b/packages/@vue/cli-ui-addon-webpack/src/main.js
@@ -7,11 +7,11 @@ Vue.use(VueProgress, {
   defaultShape: 'circle'
 })
 
-ClientAddonApi.component('vue-webpack-dashboard', WebpackDashboard)
-ClientAddonApi.component('vue-webpack-analyzer', WebpackAnalyzer)
+ClientAddonApi.component('org.vue.webpack.components.dashboard', WebpackDashboard)
+ClientAddonApi.component('org.vue.webpack.components.analyzer', WebpackAnalyzer)
 
-ClientAddonApi.addRoutes('vue-webpack', [
-  { path: '', name: 'test-webpack-route', component: TestView }
+ClientAddonApi.addRoutes('org.vue.webpack', [
+  { path: '', name: 'org.vue.webpack.routes.test', component: TestView }
 ])
 
 // Locales

diff --git a/packages/@vue/cli-ui/src/util/ClientAddonApi.js b/packages/@vue/cli-ui/src/util/ClientAddonApi.js
@@ -93,5 +93,6 @@ export default class ClientAddonApi {
 }
 
 export function toComponentId (id) {
+  id = id.replace(/\./g, '-')
   return `client-addon--${id}`
 }
diff --git a/packages/@vue/cli-ui/ui-defaults/tasks.js b/packages/@vue/cli-ui/ui-defaults/tasks.js
@@ -112,19 +112,19 @@ module.exports = api => {
   const views = {
     views: [
       {
-        id: 'vue-webpack-dashboard',
+        id: 'org.vue.webpack.views.dashboard',
         label: 'org.vue.vue-webpack.dashboard.title',
         icon: 'dashboard',
-        component: 'vue-webpack-dashboard'
+        component: 'org.vue.webpack.components.dashboard'
       },
       {
-        id: 'vue-webpack-analyzer',
+        id: 'org.vue.webpack.views.analyzer',
         label: 'org.vue.vue-webpack.analyzer.title',
         icon: 'donut_large',
-        component: 'vue-webpack-analyzer'
+        component: 'org.vue.webpack.components.analyzer'
       }
     ],
-    defaultView: 'vue-webpack-dashboard'
+    defaultView: 'org.vue.webpack.views.dashboard'
   }
   api.describeTask({
     match: /vue-cli-service serve(\s+--\S+(\s+\S+)?)*$/,
@@ -343,7 +343,7 @@ module.exports = api => {
 
   // Webpack dashboard
   api.addClientAddon({
-    id: 'vue-webpack',
+    id: 'org.vue.webpack.client-addon',
     path: '@vue/cli-ui-addon-webpack/dist'
   })
 

diff --git a/packages/@vue/cli-ui/vue-cli-ui.js b/packages/@vue/cli-ui/vue-cli-ui.js
@@ -13,8 +13,8 @@ module.exports = api => {
 
   // Add a test page below 'plugins', 'configurations' and 'tasks' on the left sidebar
   api.addView({
-    id: 'vue-webpack-test-view',
-    name: 'test-webpack-route',
+    id: 'org.vue.webpack.views.test',
+    name: 'org.vue.webpack.routes.test',
     // icon: 'pets',
     icon: '/public/webpack-logo.png',
     tooltip: 'Test view from webpack addon'