Skip to content

jsonchou/replace-daddy

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

16 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Replace loader for Webpack

Replace everything in all plain text file...

Install:

$ npm i -D replace-daddy

Usage:

Hardcode

# project
const assetsPath = '__debug__'==='true' ? `http://__localIP__:__localPORT__/foo` : `//cdn.site.com/assets/bar`;
import routes from './router/__routerMode__'
/* webpackChunkName: "__spaDirBuild__/Index" */

# webpack
module.exports = {
  // ...
  module: {
    loaders: [
      {
        exclude: /node_modules/,
        test: /\.(js|jsx|vue)$/,
        loader: 'replace-daddy',
        query: {
          multiple: [
            { search: '__debug__', replace: myConfig.debug || true,  }, //warning: use bool string in condition syntax 
            { search: '__localIP__', replace: getIPAddress(),  },
            { search: '__localPORT__', replace: getHostPORT(), },
            { search: '__imagesDir__', replace: 'images/bar/foo', },
            { search: '__spaDirBuild__', replace:'assets/scripts'},
            { search: '__routerMode__', replace: 'router-split', regexMode:'ig' },
          ]
        }
      }
    ]
  }
}

Dynamic by local config file

# project
import routes from './router/__routerMode__'
import boot from './config/__bootPath__'

# webpack
module.exports = {
  // ...
  module: {
    loaders: [
      {
         test: /\.(js|jsx|vue)$/,
        loader: 'replace-daddy',
        query: {
          multiple: [
             { file: path.join(__dirname, '..', 'api/config.js'), alias: '__daddy__' },
          ]
        }
      }
    ]
  }
}

### CONSTS.js  like 

module.exports = {
    debug: 'dev',//there can be bool, number whatever
    prefix:'ax',
    router: {
        split: true, 
        mode: 'hash', 
    },
    __daddy__: [
        { search: '__prefix__', replace:'prefix', regexMode: 'ig' },
        { search: '__debug__', replace:'debug', regexMode: 'ig' },
        { search: "__routerMode__", replace: { "router.split==true": "router-split", "router.split==false": "router-common" }, regexMode: "ig" },
        { search: "__bootPath__", replace: { "debug=='dev'": "config.dev.js", "debug=='pro'": "config.pro.js" } },
    ]
}

Advanced

tips

  • lot of spa(vue,react,ng) projects(pro1,pro2,pro3) in a single webpack environment, you may need root and key to make your files unique to been replaced
# project
import routes from './router/__routerMode__'
import boot from './router/__bootPath__'

# webpack
module.exports = {
    //...
    module: {
      loaders: [{
        test: /\.(js|jsx|vue)$/,
        loader: 'replace-daddy',
        query: {
            multiple: [
                { search: '__routerMode__', replace: 'whatever', regexMode: 'ig' },
                { root: 'vue', name: 'spafoldername', file: 'api/CONSTS.js', alias: '__daddy__'},
            ]
          }
      }
    ]}
}

Why this loader been created

fake & error code

if (config.router.split) {
    import routes from './router/router-split' //code spliting by router
} else {
    import routes from './router/router-common'
}
// you know why

About

replace-dady

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published