Code Monkey home page Code Monkey logo

learning_webpack's Introduction

webpack 基本用法

http://webpack.github.io/docs/tutorials/getting-started/

install

npm install webpack -g

从 entry.js 开始 boundle 成 bundle.js

webpack ./entry.js bundle.js

load css file

条件:

  1. Create a empty node_modules folder.
  2. Run npm install css-loader style-loader inside the floder.
require("!style!css!./style.css"); //in entry.js

或者 better:

require("./style.css"); //in entry.js
webpack ./entry.js bundle.js --module-bind 'css=style!css'  //in commend line

* 在 config file 中配置

module.exports = {
    entry: "./entry.js",
    output: {
        path: __dirname,
        filename: "bundle.js"
    },
    module: {
        loaders: [
            { test: /\.css$/, loader: "style!css" }
        ]
    }
};


webpack  //命令

* 方便查看变更:watch mode 以及 dev-server mode

webpack --progress --colors --watch
webpack-dev-server --progress --colors //(需要npm install webpack-dev-server -g)

dev-server 地址: http://localhost:8080/webpack-dev-server/bundle

learning_webpack's People

Watchers

Tim Qian avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.