feat: Bundle CSS file separately.(Project perfect)

Author: leezng

.gitignore

@@ -2,12 +2,13 @@
 node_modules/
 example-dist/
 dist/
+lib/
+react/
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 test/e2e/reports
 selenium-debug.log
-react/
 
 # Editor directories and files
 .idea

.travis.yml

@@ -13,15 +13,13 @@ stages:
   - lint
   - name: gh_pages
     if: branch = master
-  - name: github_release
-    if: branch = master
 
 jobs:
   include:
     - stage: lint
       script: npm run lint
     - stage: gh_pages
-      script: npm run build
+      script: npm run build:example
       after_script:
         - git clone -b gh-pages "https://${GH_TOKEN}@${GH_REF}" gh-pages
         - rm -r gh-pages/*
@@ -32,20 +30,6 @@ jobs:
         - git add .
         - git commit -m "update gh-pages"
         - git push --quiet "https://${GH_TOKEN}@${GH_REF}" gh-pages:gh-pages
-    - stage: github_release
-      script: echo "Deploying to GitHub releases ..."
-      deploy:
-        provider: releases
-        api_key: ${GH_TOKEN}
-        skip_cleanup: true
-        on:
-          tags: true
-    # - stage: npm_release
-    #   script: echo "Deploying to npm releases ..."
-    #   deploy:
-    #     provider: npm
-    #     email: ""
-    #     api_key: ""
 
 # branches:
 #   only:

build/webpack.prod.conf.js

@@ -10,8 +10,8 @@ const HtmlWebpackPlugin = require('html-webpack-plugin')
 const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin')
 
-const isDist = !!process.env.DIST_ENV
-const distPath = '../dist'
+const isExampleEnv = process.env.EXAMPLE_ENV
+const distPath = '../lib'
 
 const env = process.env.NODE_ENV === 'testing'
   ? require('../config/test.env')
@@ -36,18 +36,10 @@ const webpackConfig = merge(baseWebpackConfig, {
     new webpack.DefinePlugin({
       'process.env': env
     }),
-    new CopyWebpackPlugin({
-      patterns: [
-        {
-          from: path.resolve(__dirname, '../README.md'),
-          to: isDist ? path.resolve(__dirname, distPath) : config.build.assetsRoot
-        }
-      ],
-    }),
   ]
 })
 
-if (isDist) {
+if (!isExampleEnv) {
   webpackConfig.entry = {
     'vue-json-pretty': './src/index.js'
   }
@@ -70,14 +62,6 @@ if (isDist) {
         safe: true
       }
     }),
-    new CopyWebpackPlugin({
-      patterns: [
-        {
-          from: path.resolve(__dirname, '../package.json'),
-          to: path.resolve(__dirname, distPath)
-        }
-      ],
-    }),
   )
 } else {
   webpackConfig.optimization = {

package.json

@@ -1,13 +1,13 @@
 {
   "name": "vue-json-pretty",
-  "version": "1.6.7",
+  "version": "1.7.0-rc.2",
   "description": "A JSON tree view component that is easy to use and also supports data selection.",
   "author": "leezng <[email protected]>",
-  "main": "vue-json-pretty.js",
+  "main": "lib/vue-json-pretty.js",
   "scripts": {
     "dev": "node build/dev-server.js",
     "build": "node build/build.js",
-    "dist": "cross-env DIST_ENV=true node build/build.js",
+    "build:example": "cross-env EXAMPLE_ENV=true node build/build.js",
     "e2e": "node test/e2e/runner.js",
     "test": "npm run e2e",
     "lint": "eslint --ext .js,.vue src test/e2e/specs"
@@ -80,7 +80,10 @@
   "browserslist": [
     "> 1%",
     "last 5 versions",
-    "not ie <= 10"
+    "not ie <= 11"
+  ],
+  "files": [
+    "lib"
   ],
   "dependencies": {}
 }

src/index.js

@@ -1,6 +1,7 @@
+import pkg from '../package.json';
 import App from './components/app.vue'
 import './assets/less/index.less'
 
 export default Object.assign({}, App, {
-  version: '1.6.7'
+  version: pkg.version
 })