Anivive · dan2kx · Feb 11, 2021
diff --git a/package-lock.json b/package-lock.json
diff --git a/templates/README.md b/templates/README.md
@@ -44,6 +44,10 @@ npm run docs
 visit -> http://localhost:3000
 ```
 
+#### Build Package
+```
+npm run build
+```
 
 
 ## Table of Contents
@@ -118,8 +122,13 @@ View your documentation at: `http://localhost:3000`
 
 [Docsify Documentation](https://docsify.js.org/#/quickstart)
 
----
+## Building
+When you are ready to deploy your package, run the build command, this will create a dist folder with compiled files that can then be published to a package manager such as `npm` or `yarn`.
 
+You should import and then export the components and/or utilities that you would like to be accessable in the `src/main.js` file, so that users can import only the relevant parts of your application easily.
+
+
+---
 
 
 ## Contributing Guidelines

diff --git a/templates/package.json b/templates/package.json
@@ -8,13 +8,16 @@
     "Unknown"
   ],
   "scripts": {
+    "build": "vue-cli-service build --target lib --name index src/main.js src/sass/main.scss && rm ./dist/demo.html",
     "lint": "vue-cli-service lint",
     "docs": "docsify serve ./docs",
     "test": "jest ./tests"
   },
-  "main": "main.ts",
+  "main": "dist/index.common.js",
+  "unpkg": "dist/index.min.js",
   "dependencies": {
-    "core-js": "^3.8.1",
+  },
+  "peerDependencies": {
     "vue": "^3.0.5"
   },
   "devDependencies": {
@@ -29,20 +32,24 @@
     "@vue/eslint-config-typescript": "^5.0.2",
     "@vue/test-utils": "^2.0.0-beta.14",
     "babel-jest": "^26.6.3",
+    "core-js": "^3.8.1",
     "eslint": "^6.8.0",
     "eslint-import-resolver-alias": "^1.1.2",
     "eslint-plugin-import": "^2.22.1",
     "eslint-plugin-vue": "^7.2.0",
     "jest": "^26.6.3",
+    "sass": "^1.30.0",
+    "sass-loader": "^10.1.0",
     "ts-jest": "^26.4.4",
     "typescript": "^4.1.3",
+    "vue": "^3.0.5",
     "vue-jest": "^5.0.0-alpha.8"
   },
   "bugs": {
     "url": "https://github.com/Anivive/create-vue3-package/issues"
   },
   "directories": {
-    "test": "tests"
+    "test": "dist/*"
   },
   "keywords": [],
   "homepage": "https://github.com/Anivive/create-vue3-package#readme",

diff --git a/templates/src/main.ts → templates/src/components/main.ts b/templates/src/main.ts → templates/src/components/main.ts
diff --git a/templates/src/main.vue → templates/src/components/main.vue b/templates/src/main.vue → templates/src/components/main.vue
diff --git a/templates/src/main.js b/templates/src/main.js
@@ -0,0 +1,3 @@
+import Main from './components/main.ts';
+
+export default Main;
diff --git a/templates/src/sass/main.scss b/templates/src/sass/main.scss
diff --git a/templates/tests/example-ts-file.test.js b/templates/tests/example-ts-file.test.js
@@ -1,5 +1,5 @@
 import { shallowMount } from '@vue/test-utils';
-import Component from '@/main.ts';
+import Component from '@/components/main.ts';
 
 let wrapper;
 

diff --git a/templates/tests/example-vue-file.test.js b/templates/tests/example-vue-file.test.js
@@ -1,5 +1,5 @@
 import { shallowMount } from '@vue/test-utils';
-import Component from '@/main.vue';
+import Component from '@/components/main.vue';
 
 let wrapper;
 

diff --git a/templates/vue.config.js b/templates/vue.config.js
@@ -0,0 +1,15 @@
+// vue.config.js
+module.exports = {
+  lintOnSave: false,
+  css: {
+    loaderOptions: {
+      scss: {
+        additionalData: ''
+      },
+    }
+  },
+  devServer: {
+    hot: false,
+    liveReload: true
+  }
+};
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		import Main from './components/main.ts';

		export default Main;