feat(dist): add esm distribution for bundlers

components/entry.esm.js

@@ -1,4 +1,4 @@
-import './styles.scss'
+import './entry.esm.scss'
 import plugin from './index.js'
 export * from './index.js'
 export default plugin

components/entry.esm.scss

@@ -0,0 +1,3 @@
+@import "@material/theme/mdc-theme";
+@import "@material/elevation/mdc-elevation";
+@import "@material/ripple/mdc-ripple";

package.json

@@ -14,9 +14,9 @@
   ],
   "author": "Sebastien Tasson <[email protected]>",
   "license": "MIT",
-  "main": "dist/index.js",
-  "module": "dist/index.esm.js",
-  "unpkg": "dist/index.js",
+  "main": "dist/vue-mdc-adapter.js",
+  "module": "dist/index.js",
+  "unpkg": "dist/vue-mdc-adapter.js",
   "files": [
     "dist",
     "static",

rollup.config.js

@@ -94,11 +94,11 @@ function createUmdConfig(module, env) {
 
   const isProduction = env === `production`
   const isDevelopment = env === `development`
-  const dist = module ? module +'/index' : 'index' 
+  const dist = module ? `dist/${module}/vue-mdc-${module}` : 'dist/vue-mdc-adapter'
   const name = module ? 'VueMDC' + capitalize(module)  : 'VueMDCAdapter'
   const input = 'components/' + ( module ? module + '/' : '')  + 'entry.js' 
   const output = {
-    file: (isDevelopment) ? `dist/${dist}.js` : `dist/${dist}.min.js`,
+    file: dist + (isDevelopment ? `.js` : `.min.js`),
     format: 'umd',
     name
   }
@@ -118,7 +118,7 @@ function createUmdConfig(module, env) {
   }
 
   if (isProduction) {
-    sassConfig.output = `dist/${dist}.min.css`
+    sassConfig.output = dist + '.min.css'
   } else {
     sassConfig.insert = true
   }
@@ -159,11 +159,11 @@ function createUmdConfig(module, env) {
 
 function createEsmConfig(module) {
 
-  const dist = module ? module +'/index' : 'index' 
-  // const name = module ? 'VueMDC' + camelize(module)  : 'VueMDCAdapter'
+  const dist = module ? `dist/${module}/index.js` : 'dist/index.js'
+  const style = module ? `dist/${module}/styles.css` : 'dist/styles.css'
   const input = 'components/' + ( module ? module + '/' : '')  + 'entry.esm.js' 
   const output = {
-    file: `dist/${dist}.esm.js`,
+    file: dist,
     format: 'es',
   }
 
@@ -173,14 +173,14 @@ function createEsmConfig(module) {
 
   const sassConfig = {
     include: [ '**/*.css', '**/*.scss' ],
-    output: `dist/${dist}.css`,
+    output: style,
     options: {includePaths: ['node_modules']},
     processor: css => postcss([autoprefixer()])
                       .process(css)
                       .then(result => result.css)
   }
 
-  let intro = (module in PLUGINS || !module) ? "import './index.css'" : ''
+  let intro =  (PLUGINS.includes(module) || !module) ? "import './styles.css';" : ''
   let external = []
   let paths = {}
   let outro = ''
@@ -190,15 +190,15 @@ function createEsmConfig(module) {
       if (folder != module) {
         let id = path.resolve('.', 'components', folder, 'index.js') 
         external.push(id)
-        paths[id] = `../${folder}/index.esm.js`
+        paths[id] = `../${folder}/index.js`
       }
     }
   } else {
     for (let folder of MODULES) {
       if (folder != module) {
         let id = path.resolve('.', 'components', folder, 'index.js') 
         external.push(id)
-        paths[id] = `./${folder}/index.esm.js`
+        paths[id] = `./${folder}/index.js`
       }
     }
 
@@ -209,7 +209,7 @@ function createEsmConfig(module) {
     }
     outro += os.EOL
     for (let folder of PLUGINS) {
-      outro +=`export * from './${folder}/index.esm.js'` + os.EOL
+      outro +=`export * from './${folder}/index.js'` + os.EOL
     }
   }