feat: add insertVendor

Author: w-xuefeng

.syncignore

@@ -1 +1 @@
-{**/*.js.map,**/node_modules/**,src/**,package.json,package-lock.json,**/build/**,**/config/**,**/static/**,**/test/**,**/widget/**,postcss.config.js,README.md}
+{**/*.js.map,**/node_modules/**,src/**,package.json,package-lock.json,**/build/**,**/config/**,**/static/**,**/test/**,**/widget/**,**/dist/**,postcss.config.js,README.md}

build/generate.js

@@ -12,6 +12,16 @@ const INDEXFILE = resolve('index.html')
 const CONFIGXML = resolve('config.xml')
 const TO = resolve('widget')
 
+
+function insertVendor() {
+  const cssVendor = `<link href=./static/css/vendor.css rel=stylesheet>`
+  const jsVendor = `<script type=text/javascript src=./static/js/vendor.js></script>`
+  glob.sync(`${FROME}/*.html`).forEach((pathname) => {
+    let tempContent = fs.readFileSync(pathname).toString();
+    fs.writeFileSync(pathname, tempContent.replace(/<link/, `${cssVendor}<link`).replace(/<script/, `${jsVendor}<script`))
+  })
+}
+
 function getSource () {
   let source = []
   let dir = []
@@ -26,6 +36,7 @@ function getSource () {
 }
 
 function copyFile() {
+  insertVendor()
   let { source, dir } = getSource()
   dir.forEach(e => fs.mkdirSync(`${TO}${e}`))
   source.forEach(e => fs.copyFileSync(e.path, `${TO}${e.name}`))

build/utils.js

@@ -63,7 +63,7 @@ exports.cssLoaders = function (options) {
     postcss: generateLoaders(),
     less: generateLoaders('less'),
     sass: generateLoaders('sass', { indentedSyntax: true }),
-    // scss: generateLoaders('sass'),
+    scss: generateLoaders('sass'),
     // stylus: generateLoaders('stylus'),
     // styl: generateLoaders('stylus')
   }

build/webpack.dev.conf.js

@@ -30,23 +30,19 @@ const devWebpackConfig = merge(baseWebpackConfig, {
   devServer: {
     clientLogLevel: 'warning',
     historyApiFallback: {
-      rewrites: [{
-        from: /.*/,
-        to: path.posix.join(config.dev.assetsPublicPath, 'index.html')
-      }]
+      rewrites: [
+        { from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') }
+      ]
     },
     hot: true,
     contentBase: false, // since we use CopyWebpackPlugin.
     compress: true,
     host: HOST || config.dev.host,
     port: PORT || config.dev.port,
     open: config.dev.autoOpenBrowser,
-    overlay: config.dev.errorOverlay ?
-      {
-        warnings: false,
-        errors: true
-      } :
-      false,
+    overlay: config.dev.errorOverlay
+      ? { warnings: false, errors: true }
+      : false,
     publicPath: config.dev.assetsPublicPath,
     proxy: config.dev.proxyTable,
     quiet: true, // necessary for FriendlyErrorsPlugin
@@ -63,11 +59,13 @@ const devWebpackConfig = merge(baseWebpackConfig, {
       filename: utils.assetsPath('[name].css')
     }),
     // copy custom static assets
-    new CopyWebpackPlugin([{
-      from: path.resolve(__dirname, '../static'),
-      to: config.dev.assetsSubDirectory,
-      ignore: ['.*']
-    }])
+    new CopyWebpackPlugin([
+      {
+        from: path.resolve(__dirname, '../static'),
+        to: config.dev.assetsSubDirectory,
+        ignore: ['.*']
+      }
+    ])
   ]
 })
 
@@ -88,9 +86,9 @@ module.exports = new Promise((resolve, reject) => {
         compilationSuccessInfo: {
           messages: [`Your application is running here: http://${devWebpackConfig.devServer.host}:${port}`]
         },
-        onErrors: config.dev.notifyOnErrors ?
-          utils.createNotifierCallback() :
-          undefined
+        onErrors: config.dev.notifyOnErrors
+          ? utils.createNotifierCallback()
+          : undefined
       }))
 
       resolve(devWebpackConfig)

build/webpack.prod.conf.js

@@ -25,7 +25,8 @@ const webpackConfig = merge(baseWebpackConfig, {
   devtool: config.build.productionSourceMap ? config.build.devtool : false,
   output: {
     path: config.build.assetsRoot,
-    filename: utils.assetsPath('js/[name].[chunkhash].js')
+    filename: utils.assetsPath('js/[name].js')
+    // filename: utils.assetsPath('js/[name].[chunkhash].js')
     // chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
   },
   optimization: {
@@ -54,7 +55,8 @@ const webpackConfig = merge(baseWebpackConfig, {
     }),
     // extract css into its own file
     new MiniCssTextPlugin({
-      filename: utils.assetsPath('css/[name].[contenthash].css')
+      filename: utils.assetsPath('css/[name].css')
+      // filename: utils.assetsPath('css/[name].[contenthash].css')
     }),
     // Compress extracted CSS. We are using this plugin so that possible
     // duplicated CSS from different components can be deduped.

config/index.js

@@ -3,6 +3,14 @@
 // see http://vuejs-templates.github.io/webpack for documentation.
 
 const path = require('path')
+const glob = require('glob')
+function getHtmlName() {
+  let html = []
+  glob.sync(path.resolve(__dirname, '../node_modules/.temp/*.js')).forEach((pathname) => {
+    html.push(path.resolve(__dirname, pathname.replace(/[\S\s]*\/.temp/g, '../dist').replace(/\.js$/, '.html')))
+  })
+  return html
+}
 
 module.exports = {
   dev: {
@@ -45,12 +53,12 @@ module.exports = {
 
   build: {
     // Template for index.html
-    index: path.resolve(__dirname, '../dist/index.html'),
+    index: getHtmlName(),
 
     // Paths
     assetsRoot: path.resolve(__dirname, '../dist'),
     assetsSubDirectory: 'static',
-    assetsPublicPath: '',
+    assetsPublicPath: './',
 
     /**
      * Source Maps