123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264 |
- const util = require('util'),
- fs = require('fs'),
- path = require('path'),
- replace = require('replace-in-file'),
- escapeRegExp = require('lodash.escaperegexp'),
- copyFilePromise = util.promisify(fs.copyFile);
- // the directory in which you're outputting your build
- let baseDir = 'public'
- // the name for the directory where your static files will be moved to
- let staticDir = 'static'
- // the directory where your source files are placed
- let sourceDir = 'src'
- const pathMake = (p) => {
- if (!fs.existsSync(path.join(__dirname, baseDir, p))){
- fs.mkdirSync(path.join(__dirname, baseDir, p));
- }}
- pathMake(staticDir) // if the staticDir directory isn't there, create it
- // pathMake(assetsDir)// same for the assetsDir directory
- pathMake('font') // same for the fontsDir directory
- pathMake('js')
- pathMake('styles')
- const hashRemove = (hash) => {
- return hash.replace(/\.[a-z0-9]{8}\./gm, '.')
- }
- const linkReplace = (file, list, dir) => {
- list.forEach(name => {
- let startPath = `${dir}/`
- if(dir == null) { startPath = '' }
- let options = {
- files: path.join(baseDir, file),
- from: new RegExp(escapeRegExp(name), 'g'),
- to: startPath + hashRemove(name)
- }
- try {
- let changedFiles = replace.sync(options);
- // console.log('Modified files:', changedFiles.join(', '));
- }
- catch (error) {
- console.error('Error occurred:', error);
- }})}
- const parcelFakeUnignore = (file, list, dir) => {
- let options = {
- files: path.join(baseDir, file),
- from: new RegExp(/<!-- parcel-ignore \[ (.*) \] -->/, 'gm'),
- to: '$1'
- }
- try {
- let changedFiles = replace.sync(options);
- // console.log('Modified files:', changedFiles.join(', '));
- }
- catch (error) {
- console.error('Error occurred:', error);
- }}
- const filesMove = (list, dest) => {
- list.forEach(
- name => {
- fs.rename(path.join(__dirname, baseDir, name), path.join(__dirname, baseDir, dest, hashRemove(name)), function (err) {
- if (err) throw err
- console.log(`Successfully moved ${hashRemove(name)}`)
- })})}
- const copyFiles = (srcDir, destDir, files) => {
- return Promise.all(files.map(f => {
- return copyFilePromise(path.join(srcDir, f), path.join(destDir, f));
- }));
- }
- // Loop through the baseDir directory
- fs.readdir(`./${baseDir}`, (err, files) => {
- // store all files in custom arrays by type
- let html = [],
- js = [],
- css = [],
- jsMaps = [],
- cssMaps = [],
- fonts = [],
- webman = [],
- staticAssets = []
- const sortFiles = () => {
- files.forEach(file => {
- // first HTML files
- if(file.match(/.+\.(html)$/)) {
- console.log('html match', file)
- html.push(file)
- } else if(file.match(/.+\.(js)$/)) { // then JavaScripts
- console.log('JavaScript match', file)
- js.push(file)
- } else if(file.match(/.+\.(woff|woff2|eot|ttf|otf)$/)) { // then fonts
- console.log('Font match', file)
- fonts.push(file)
- } else if (file.match(/.+\.(svg)$/)) { // Cheching for font SVG
- console.log('SVG match', file)
- if (fs.readFileSync(path.join(baseDir, file), 'utf8').match(/\<font\s/gm) != null) {
- fonts.push(file)
- } else {
- staticAssets.push(file)
- }
- } else if(file.match(/.+\.(css)$/)) { // then CSS
- console.log('css match', file)
- css.push(file)
- } else if(file.match(/.+\.(js.map)$/)) { // then sourcemaps
- console.log('JS sourcemaps match', file)
- jsMaps.push(file)
- } else if(file.match(/.+\.(css.map)$/)) { // then sourcemaps
- console.log('CSS sourcemaps match', file)
- cssMaps.push(file)
- } else if(file.match(/.+\.(webmanifest)$/)) { // then webmanifest
- console.log('CSS sourcemaps match', file)
- webman.push(file)
- } else if(file.match(/.+\..+$/)){ // all other files, exclude current directory and directory one level up
- if (!file.match(/.+\.(json|webmanifest)$/)) {
- console.log('Static match', file)
- staticAssets.push(file)
- }
- }
- });
- }
- const replaceLinks = () => {
- // check what went where
- console.log('html', html, '\ncss', css, '\ncss sourcemaps', cssMaps, '\njs', js, '\njs sourcemaps', jsMaps, '\nfonts', fonts, '\nstaticAssets', staticAssets)
- // create an array for all compiled assets
- // let assets = css.concat(js).concat(map)
- // replace all other resources in html
- html.forEach(
- file => {
- staticAssets.forEach(name => {
- let options = {
- files: path.join(baseDir, file),
- from: new RegExp(escapeRegExp(name), 'g'),
- to: staticDir + '/' + hashRemove(name)
- }
- try {
- let changedFiles = replace.sync(options);
- // console.log('Modified files:', changedFiles.join(', '));
- }
- catch (error) {
- console.error('Error occurred:', error);
- }
- })
- // assets.forEach(name => {
- // let options = {
- // files: path.join(baseDir, file),
- // from: new RegExp(escapeRegExp(name), 'g'),
- // to: assetsDir + '/' + hashRemove(name)
- // }
- // try {
- // let changedFiles = replace.sync(options);
- // console.log('Modified files:', changedFiles.join(', '));
- // }
- // catch (error) {
- // console.error('Error occurred:', error);
- // }
- // })
- linkReplace(file, fonts, 'font')
- // linkReplace(file, js, 'js')
- parcelFakeUnignore(file)
- linkReplace(file, css, 'styles')
- }
- )
- webman.forEach(
- file => {
- staticAssets.forEach(name => {
- let options = {
- files: path.join(baseDir, file),
- from: new RegExp(escapeRegExp(name), 'g'),
- to: staticDir + '/' + hashRemove(name)
- }
- try {
- let changedFiles = replace.sync(options);
- }
- catch (error) {
- console.error('Error occurred:', error);
- }
- })
- linkReplace(file, staticAssets, staticDir)
- }
- )
- // replace map links in js
- js.forEach(
- file => {
- jsMaps.forEach(name => {
- let options = {
- files: path.join(baseDir, file),
- from: name,
- to: hashRemove(name)
- }
- try {
- let changedFiles = replace.sync(options);
- // console.log('Modified files:', changedFiles.join(', '));
- }
- catch (error) {
- console.error('Error occurred:', error);
- }
- })
- }
- )
- // replace links in css
- css.forEach(
- file => {
- staticAssets.forEach(name => {
- let options = {
- files: path.join(baseDir, file),
- from: new RegExp(escapeRegExp(name), 'g'),
- to: '../' + staticDir + '/' + hashRemove(name)
- }
- try {
- let changedFiles = replace.sync(options);
- // console.log('Modified files:', changedFiles.join(', '));
- }
- catch (error) {
- console.error('Error occurred:', error);
- }
- })
- linkReplace(file, fonts, '../font')
- linkReplace(file, cssMaps, null)
- }
- )
- }
- const moveBuildFiles = () => {
- // filesMove(assets, assetsDir) // move js and css and maps
- filesMove(fonts, 'font') // move fonts
- filesMove(js, 'js')
- filesMove(jsMaps, 'js')
- filesMove(css, 'styles')
- filesMove(cssMaps, 'styles')
- filesMove(staticAssets, staticDir) // move staticAssets
- }
- sortFiles();
- replaceLinks();
- moveBuildFiles();
- });
- // fs.copyFile(`${sourceDir}\\data.json`, `${baseDir}\\data.json`, (err) => {
- // if (err) throw err;
- // console.log('data.json was copied');
- // });
- // fs.copyFile(`${sourceDir}\\js\\main.js`, `${baseDir}\\js\\main.js`, (err) => {
- // if (err) throw err;
- // console.log('data.json was copied');
- // });
- // usage
- copyFiles(sourceDir, baseDir, ['data.json', 'js/main.js']).then(() => {
- console.log("JSON and JS are copied.");
- }).catch(err => {
- console.log(err);
- });
|