zoukankan      html  css  js  c++  java
  • webpack 配置文件

    Webpack 在执行的时候,除了在命令行传入参数,还可以通过指定的配置文件来执行。默认情况下,会搜索当前目录的 webpack.config.js 文件,这个文件是一个 node.js 模块,返回一个 json 格式的配置信息对象,或者通过 --config 选项来指定配置文件。

    继续我们的案例,在根目录创建 package.json 来添加 webpack 需要的依赖:

    {
      "name": "webpack-example",
      "version": "1.0.0",
      "description": "A simple webpack example.",
      "main": "bundle.js",
      "scripts": {
        "test": "echo "Error: no test specified" && exit 1"
      },
      "keywords": [
        "webpack"
      ],
      "author": "zhaoda",
      "license": "MIT",
      "devDependencies": {
        "css-loader": "^0.21.0",
        "style-loader": "^0.13.0",
        "webpack": "^1.12.2"
      }
    }
    
    # 如果没有写入权限,请尝试如下代码更改权限
    chflags -R nouchg .
    sudo chmod  775 package.json
    

    别忘了运行 npm install

    然后创建一个配置文件 webpack.config.js

    var webpack = require('webpack')
    
    module.exports = {
      entry: './entry.js',
      output: {
        path: __dirname,
        filename: 'bundle.js'
      },
      module: {
        loaders: [
          {test: /.css$/, loader: 'style-loader!css-loader'}
        ]
      }
    }
    

    同时简化 entry.js 中的 style.css 加载方式:

    require('./style.css')
    

    最后运行 webpack,可以看到 webpack 通过配置文件执行的结果和上一章节通过命令行 webpack entry.js bundle.js --module-bind 'css=style-loader!css-loader' 执行的结果是一样的。

     
  • 相关阅读:
    Root resource classes
    web.xml文件的作用
    Mac OS X 快捷键(完整篇) 转载
    Eclipse快捷键大全(转载)
    mac os 下如何清除/切换svn eclipse插件的用户
    N-Queens II
    接口是永远不能被实例化的
    Chpater 10: Sorting
    Java 理论和实践: 了解泛型
    EMQ X + ClickHouse 实现物联网数据接入与分析
  • 原文地址:https://www.cnblogs.com/ExMan/p/6758486.html
Copyright © 2011-2022 走看看