I have error: "Uncaught TypeError: Cannot assign to read only property 'exports' of object '#'". In build.js this error in line "module.exports = main;". Where is the mistake? My modules:

This my main file script.js

const showContent = require('./modules/showContent');
const main = require('./modules/screens/main');
const about = require('./modules/screens/about');
const blog = require('./modules/screens/blog');
const contacts = require('./modules/screens/contacts');
const gallery = require('./modules/screens/gallery');

$(document).ready(function() {
  console.log(main);
  showContent(main);
    $(document).on("click", "a", (e) => {
        if ( $(this).hasClass('active') ) return;

        $("a").removeClass('active');
        $(this).addClass('active');

        $(".slide").slideUp(800);

        const self = this;
        setTimeout(() => showContent($(self).attr('id')), 800);
    });
});

main.js

const getElementFromTemplate = require('../getElementFromTemplate');
const showContent = require('../showContent');

const main = getElementFromTemplate(`<div>
        <h2>Добро пожаловать на Фиджи</h2>
        <img src="images/img03.jpg" alt="img03">
        <p><b>Фиджи</b> - название государства и архипелага из 332 островов, на которых это государство находится: на юго-западе Тихого океана, среди других островов и архипелагов Меланезии - правда, расстояние между этими частицами суши составляет сотни и тысячи километров. Острова архипелага Фиджи коралловые и вулканические; примерно 1/3 их нежилые, однако это и привлекает внимание желающих уединиться по разным причинам - влюбленных пар, молодоженов, романтиков и просто любителей нетронутой природы.</p>
      </div>
      <div>
        <h2>Климат Фиджи: мягкие тропики</h2>
        <img src="images/img04.jpg" alt="img04">
        <p>Климат влажный тропический, но сильной жары нет ни летом, в сезон дождей - около 26 ° C, ни в сухой сезон - около 23 ° C: здесь комфортно чувствуют себя и взрослые, и дети. Правда, бывают и более высокие температуры - 28-34 ° C, но в ночи всегда становится прохладнее.</p>
        <p>Для отдыха обычно рекомендуется выбирать период с мая по декабрь, когда дождей почти нет. Погода отличается в разных частях архипелага: так, на южных берегах основных островов дожди идут чаще и больше высокая влажность воздуха.</p>
      </div>
      <div>
        <h2>Пляжи на Фиджи</h2>
        <img src="images/img05.jpg" alt="img05">
        <p>Больше всего туристов «привлекается» на остров Вити-Леву, крупнейший в архипелаге Фиджи. Здесь любой может найти себе место по душе и по карману: есть и первоклассные отели и недорогие гостиницы. Пляжи тянутся более чем на 100 км - их называют Коралловым берегом; территория острова - более 10 000 км, и на побережье расположено множество различных курортов, от фешенебельных до тихих и незаметных. Для семейного отдыха хороший пляж Paradise, тихий и спокойный, с мелким белым песком и почти не затронутым «окультуриванием»: пальмы рядом растут прямо у берега и скрыться от жаркого солнца - не проблема, что особенно актуально для семей с детьми. Однако, об удобных головные уборы, солнечные очки и солнцезащитные средства следует позаботиться вовремя: загар на Фиджи очень красивый, но получить солнечные ожоги, в том числе и находясь в воде, можно «в два счета». Взрослые могут найти себе здесь массу развлечений, от дайвинга до рыбалки с арендой катера.</p>
      </div>
      <div>
        <h2>Экскурсии и памятные места на Фиджи</h2>
        <img src="images/img06.jpg" alt="img06">
        <p>Кажется, что памятников на Фиджи не может быть много, но их, исторических и природных, наберется немало. Сигатока - песчаные дюны, является уникальным местом: на Фиджи везде зелень, а здесь - волнообразные холмы из песка до 60 м высотой - считается, что они формировались миллионы лет. История местности не менее интересна, чем пейзаж: здесь создан археологический парк и открыт музей. Археологи находят вещи, которым около 3000 лет, а здешние захоронения еще старше.</p>
        <p>На Фиджи очень много национальных парков и заповедников, за охраной которых постоянно следят местные власти: ведь нетронутая природа - главное богатство этой небольшой и гостеприимной страны с приветливыми и веселыми жителями.</p>
      </div>`);

module.exports = main;

showContent.js

const showContent = (contentTemplate) => {
  const content = document.querySelector(`main`);
  content.innerHTML = ``;
  content.appendChild(contentTemplate);
};

module.exports = showContent;

webpack.config.js

module.exports = {
    entry: "./script",
    output: {
        filename: "build.js"
    }
};

I have error: "Uncaught TypeError: Cannot assign to read only property 'exports' of object '#'". In build.js this error in line "module.exports = main;". Where is the mistake? My modules:

This my main file script.js

const showContent = require('./modules/showContent');
const main = require('./modules/screens/main');
const about = require('./modules/screens/about');
const blog = require('./modules/screens/blog');
const contacts = require('./modules/screens/contacts');
const gallery = require('./modules/screens/gallery');

$(document).ready(function() {
  console.log(main);
  showContent(main);
    $(document).on("click", "a", (e) => {
        if ( $(this).hasClass('active') ) return;

        $("a").removeClass('active');
        $(this).addClass('active');

        $(".slide").slideUp(800);

        const self = this;
        setTimeout(() => showContent($(self).attr('id')), 800);
    });
});

main.js

const getElementFromTemplate = require('../getElementFromTemplate');
const showContent = require('../showContent');

const main = getElementFromTemplate(`<div>
        <h2>Добро пожаловать на Фиджи</h2>
        <img src="images/img03.jpg" alt="img03">
        <p><b>Фиджи</b> - название государства и архипелага из 332 островов, на которых это государство находится: на юго-западе Тихого океана, среди других островов и архипелагов Меланезии - правда, расстояние между этими частицами суши составляет сотни и тысячи километров. Острова архипелага Фиджи коралловые и вулканические; примерно 1/3 их нежилые, однако это и привлекает внимание желающих уединиться по разным причинам - влюбленных пар, молодоженов, романтиков и просто любителей нетронутой природы.</p>
      </div>
      <div>
        <h2>Климат Фиджи: мягкие тропики</h2>
        <img src="images/img04.jpg" alt="img04">
        <p>Климат влажный тропический, но сильной жары нет ни летом, в сезон дождей - около 26 ° C, ни в сухой сезон - около 23 ° C: здесь комфортно чувствуют себя и взрослые, и дети. Правда, бывают и более высокие температуры - 28-34 ° C, но в ночи всегда становится прохладнее.</p>
        <p>Для отдыха обычно рекомендуется выбирать период с мая по декабрь, когда дождей почти нет. Погода отличается в разных частях архипелага: так, на южных берегах основных островов дожди идут чаще и больше высокая влажность воздуха.</p>
      </div>
      <div>
        <h2>Пляжи на Фиджи</h2>
        <img src="images/img05.jpg" alt="img05">
        <p>Больше всего туристов «привлекается» на остров Вити-Леву, крупнейший в архипелаге Фиджи. Здесь любой может найти себе место по душе и по карману: есть и первоклассные отели и недорогие гостиницы. Пляжи тянутся более чем на 100 км - их называют Коралловым берегом; территория острова - более 10 000 км, и на побережье расположено множество различных курортов, от фешенебельных до тихих и незаметных. Для семейного отдыха хороший пляж Paradise, тихий и спокойный, с мелким белым песком и почти не затронутым «окультуриванием»: пальмы рядом растут прямо у берега и скрыться от жаркого солнца - не проблема, что особенно актуально для семей с детьми. Однако, об удобных головные уборы, солнечные очки и солнцезащитные средства следует позаботиться вовремя: загар на Фиджи очень красивый, но получить солнечные ожоги, в том числе и находясь в воде, можно «в два счета». Взрослые могут найти себе здесь массу развлечений, от дайвинга до рыбалки с арендой катера.</p>
      </div>
      <div>
        <h2>Экскурсии и памятные места на Фиджи</h2>
        <img src="images/img06.jpg" alt="img06">
        <p>Кажется, что памятников на Фиджи не может быть много, но их, исторических и природных, наберется немало. Сигатока - песчаные дюны, является уникальным местом: на Фиджи везде зелень, а здесь - волнообразные холмы из песка до 60 м высотой - считается, что они формировались миллионы лет. История местности не менее интересна, чем пейзаж: здесь создан археологический парк и открыт музей. Археологи находят вещи, которым около 3000 лет, а здешние захоронения еще старше.</p>
        <p>На Фиджи очень много национальных парков и заповедников, за охраной которых постоянно следят местные власти: ведь нетронутая природа - главное богатство этой небольшой и гостеприимной страны с приветливыми и веселыми жителями.</p>
      </div>`);

module.exports = main;

showContent.js

const showContent = (contentTemplate) => {
  const content = document.querySelector(`main`);
  content.innerHTML = ``;
  content.appendChild(contentTemplate);
};

module.exports = showContent;

webpack.config.js

module.exports = {
    entry: "./script",
    output: {
        filename: "build.js"
    }
};

• javascript
• jquery
• webpack

1 Answer 1

more info - webpack/issues/4039

reason

This issue was newly affecting me after instructing Babel to not transpile module syntax. It only occurred when trying to use CommonJS style module.exports inside of ES modules. This can be fixed by simply replacing all module.exports = ... to export default ... where applicable, as this is seemingly equivalent for old Babel-style ES module transpilation. (Note though, that importing this module using require will probably give you an option with a default key rather than the default export itself, so it's probably best you make the switch across the entire codebase at once.)

by jchv@github

setting in .babelrc

Removing "modules: false" in .babelrc

preset-es2015 Options - modules

"amd" | "umd" | "systemjs" | "monjs" | false, defaults to "monjs".
Enable transformation of ES6 module syntax to another module type.
Setting this to false will not transform modules.