Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
246 views
in Technique[技术] by (71.8m points)

javascript - 我如何错误地导出秒表?(How am I exporting my stopwatch incorrectly?)

I am having trouble understanding how module require works.

(我在理解模块需求如何工作时遇到了麻烦。)

I am trying to export my stopwatch js to app js.

(我正在尝试将秒表js导出到应用js。)

And for some reason, it is not working correctly.

(由于某种原因,它无法正常工作。)

stopwatch.js

(stopwatch.js)

       var Stopwatch = function(elem, options) {

        var timer       = createTimer(),
            startButton = createButton("start", start),
            stopButton  = createButton("stop", stop),
            resetButton = createButton("reset", reset),
            offset,
            clock,
            interval;

        // default options
        options = options || {};
        options.delay = options.delay || 1;

        // append elements     
        elem.appendChild(timer);
        elem.appendChild(startButton);
        elem.appendChild(stopButton);
        elem.appendChild(resetButton);

        // initialize
        reset();

        // private functions
        function createTimer() {
          return document.createElement("span");
        }

        function createButton(action, handler) {
          var a = document.createElement("a");
          a.href = "#" + action;
          a.innerHTML = action;
          a.addEventListener("click", function(event) {
            handler();
            event.preventDefault();
          });
          return a;
        }

        function start() {
          if (!interval) {
            offset   = Date.now();
            interval = setInterval(update, options.delay);
          }
        }

        function stop() {
          if (interval) {
            clearInterval(interval);
            interval = null;
          }
        }

        function reset() {
          clock = 0;
          render();
        }

        function update() {
          clock += delta();
          render();
        }

        function render() {
          timer.innerHTML = clock/1000; 
        }

        function delta() {
          var now = Date.now(),
              d   = now - offset;

          offset = now;
          return d;
        }

        // public API
        this.start  = start;
        this.stop   = stop;
        this.reset  = reset;
      };

    module.exports = Stopwatch

app.js

(app.js)

const {Stopwatch} = require('./utils/stopwatch')

const startButton = document.querySelector('.start-button')

startButton.addEventListener('click', (event) => {
    event.preventDefault()

})

const elem = document.querySelector('.stop-watch')


const Stopwatch1 = new Stopwatch(elem) 

I am getting app.js:1 Uncaught ReferenceError: require is not defined at app.js:1 on the console

(我正在获取app.js:1 Uncaught ReferenceError:在控制台上的app.js:1未定义require)

I know I can just link the script on my html but I want to know why this is not working.

(我知道我可以在HTML上链接脚本,但是我想知道为什么这不起作用。)

  ask by Domzi27 translate from so

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)
等待大神答复

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...