├── .babelrc
├── .gitignore
├── .npmignore
├── README.md
├── build
├── rollup.config.base.js
├── rollup.config.browser.js
├── rollup.config.es.js
└── rollup.config.umd.js
├── docs
├── .babelrc
├── .editorconfig
├── .gitignore
├── README.md
├── dist
│ ├── build.js
│ └── build.js.map
├── index.html
├── package-lock.json
├── package.json
├── src
│ ├── App.vue
│ └── main.js
└── webpack.config.js
├── package-lock.json
├── package.json
└── src
├── components
├── list-item
│ ├── index.js
│ └── main.vue
└── list
│ ├── index.js
│ └── main.vue
├── index.js
└── utils
└── util.js
/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 | "presets": [
3 | ["env", { "modules": false }],
4 | "stage-3"
5 | ],
6 | "plugins": [
7 | [
8 | "module-resolver",
9 | {
10 | "root": ["src/"]
11 | }
12 | ]
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | node_modules/
3 | .vscode/
4 | dist/
5 | npm-debug.log
6 | yarn-error.log
7 |
8 | # Editor directories and files
9 | .idea
10 | *.suo
11 | *.ntvs*
12 | *.njsproj
13 | *.sln
14 |
--------------------------------------------------------------------------------
/.npmignore:
--------------------------------------------------------------------------------
1 | docs/
2 | .babelrc
3 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/blryli/vue-rollup-component-template/e9ac7eab58dfea5805ddf5792f723341ce3742c9/README.md
--------------------------------------------------------------------------------
/build/rollup.config.base.js:
--------------------------------------------------------------------------------
1 | import resolve from 'rollup-plugin-node-resolve' // 告诉 Rollup 如何查找外部模块
2 | import commonjs from 'rollup-plugin-commonjs' // 将CommonJS模块转换为 ES2015 供 Rollup 处理
3 | import vue from 'rollup-plugin-vue' // 处理vue文件
4 | import babel from 'rollup-plugin-babel' // rollup 的 babel 插件，ES6转ES5
5 | import css from 'rollup-plugin-css-only' // 提取css，压缩能力不行
6 | import CleanCSS from 'clean-css' // 压缩css
7 | import { writeFileSync } from 'fs' // 写文件
8 |
9 | export default {
10 | input: 'src/index.js',
11 | plugins: [
12 | resolve({ extensions: ['.vue'] }),
13 | commonjs(),
14 | css({ output(style) {
15 | // 压缩 css 写入 dist/vue-rollup-component-template.css
16 | writeFileSync('dist/vue-rollup-component-template.css', new CleanCSS().minify(style).styles)
17 | } }),
18 | // css: false 将
60 |
--------------------------------------------------------------------------------
/docs/src/main.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 | import App from './App.vue'
3 | import VueRollupComponentTemplate from '../../'
4 | import '../../dist/vue-rollup-component-template.css'
5 |
6 | Vue.use(VueRollupComponentTemplate)
7 |
8 | new Vue({
9 | el: '#app',
10 | render: h => h(App)
11 | })
12 |
--------------------------------------------------------------------------------
/docs/webpack.config.js:
--------------------------------------------------------------------------------
1 | var path = require('path')
2 | var webpack = require('webpack')
3 |
4 | module.exports = {
5 | entry: './src/main.js',
6 | output: {
7 | path: path.resolve(__dirname, './dist'),
8 | publicPath: '/dist/',
9 | filename: 'build.js'
10 | },
11 | module: {
12 | rules: [
13 | {
14 | test: /\.css$/,
15 | use: [
16 | 'vue-style-loader',
17 | 'css-loader'
18 | ],
19 | }, {
20 | test: /\.vue$/,
21 | loader: 'vue-loader',
22 | options: {
23 | loaders: {
24 | }
25 | // other vue-loader options go here
26 | }
27 | },
28 | {
29 | test: /\.js$/,
30 | loader: 'babel-loader',
31 | exclude: /node_modules/
32 | },
33 | {
34 | test: /\.(png|jpg|gif|svg)$/,
35 | loader: 'file-loader',
36 | options: {
37 | name: '[name].[ext]?[hash]'
38 | }
39 | }
40 | ]
41 | },
42 | resolve: {
43 | alias: {
44 | 'vue$': 'vue/dist/vue.esm.js'
45 | },
46 | extensions: ['*', '.js', '.vue', '.json']
47 | },
48 | devServer: {
49 | historyApiFallback: true,
50 | noInfo: true,
51 | overlay: true
52 | },
53 | performance: {
54 | hints: false
55 | },
56 | devtool: '#eval-source-map'
57 | }
58 |
59 | if (process.env.NODE_ENV === 'production') {
60 | module.exports.devtool = '#source-map'
61 | // http://vue-loader.vuejs.org/en/workflow/production.html
62 | module.exports.plugins = (module.exports.plugins || []).concat([
63 | new webpack.DefinePlugin({
64 | 'process.env': {
65 | NODE_ENV: '"production"'
66 | }
67 | }),
68 | new webpack.optimize.UglifyJsPlugin({
69 | sourceMap: true,
70 | compress: {
71 | warnings: false
72 | }
73 | }),
74 | new webpack.LoaderOptionsPlugin({
75 | minimize: true
76 | })
77 | ])
78 | }
79 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "vue-rollup-component-template",
3 | "version": "1.0.0",
4 | "description": "A rollup + vue component development template",
5 | "main": "dist/vue-rollup-component-template.umd.js",
6 | "module": "dist/vue-rollup-component-template.esm.js",
7 | "unpkg": "dist/vue-rollup-component-template.min.js",
8 | "scripts": {
9 | "build": "npm run build:browser && npm run build:es && npm run build:umd",
10 | "build:browser": "rollup --config build/rollup.config.browser.js",
11 | "build:es": "rollup --config build/rollup.config.es.js",
12 | "build:umd": "rollup --config build/rollup.config.umd.js",
13 | "dev": "cross-env NODE_ENV=development rollup --config build/rollup.config.es.js --watch"
14 | },
15 | "keywords": [
16 | "vue",
17 | "vuejs",
18 | "rollup",
19 | "rollupjs",
20 | "template",
21 | "component"
22 | ],
23 | "author": "blryli",
24 | "license": "MIT",
25 | "repository": {
26 | "type": "git",
27 | "url": "git+https://github.com/blryli/vue-rollup-component-template.git"
28 | },
29 | "bugs": {
30 | "url": "https://github.com/blryli/vue-rollup-component-template/issues"
31 | },
32 | "homepage": "https://github.com/blryli/vue-rollup-component-template#readme",
33 | "devDependencies": {
34 | "babel-core": "^6.26.3",
35 | "babel-plugin-module-resolver": "^3.2.0",
36 | "babel-preset-env": "^1.7.0",
37 | "babel-preset-stage-3": "^6.24.1",
38 | "clean-css": "^4.2.1",
39 | "cross-env": "^5.2.0",
40 | "rollup": "^1.16.7",
41 | "rollup-plugin-babel": "^3.0.0",
42 | "rollup-plugin-commonjs": "^10.0.1",
43 | "rollup-plugin-css-only": "^1.0.0",
44 | "rollup-plugin-node-resolve": "^5.2.0",
45 | "rollup-plugin-uglify-es": "0.0.1",
46 | "rollup-plugin-vue": "^5.0.1",
47 | "vue": "^2.6.10",
48 | "vue-template-compiler": "^2.6.10"
49 | }
50 | }
51 |
--------------------------------------------------------------------------------
/src/components/list-item/index.js:
--------------------------------------------------------------------------------
1 | import Main from './main';
2 | export default Main
3 |
--------------------------------------------------------------------------------
/src/components/list-item/main.vue:
--------------------------------------------------------------------------------
1 |
2 |
10 |
11 |
12 |
18 |
19 |
25 |
--------------------------------------------------------------------------------
/src/components/list/index.js:
--------------------------------------------------------------------------------
1 | import Main from './main';
2 | export default Main
3 |
--------------------------------------------------------------------------------
/src/components/list/main.vue:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
当前时间：
6 |
{{date}}
7 |
8 |