Merge pull request #174 from webpack-contrib/docs/source-map-example

docs: add source map example
webpack-contrib · Mar 20, 2017 · 84c82fe · 84c82fe
2 parents e0d0006 + 5297675
commit 84c82fe
Show file tree

Hide file tree

Showing 5 changed files with 69 additions and 0 deletions.
diff --git a/examples/sourceMaps/index.html b/examples/sourceMaps/index.html
@@ -0,0 +1,9 @@
+<!DOCTYPE>
+<html>
+  <head>
+    <script src="/bundle.js"></script>
+  </head>
+  <body>
+    <div class="box"></div>
+  </body>
+</html>
diff --git a/examples/sourceMaps/main.less b/examples/sourceMaps/main.less
@@ -0,0 +1,6 @@
+@import "./other.less";
+
+.box:extend(.hotpink) {
+  width: 200px;
+  height: 200px;
+}
diff --git a/examples/sourceMaps/other.less b/examples/sourceMaps/other.less
@@ -0,0 +1,3 @@
+.hotpink {
+  background: hotpink;
+}
diff --git a/examples/sourceMaps/package.json b/examples/sourceMaps/package.json
@@ -0,0 +1,19 @@
+{
+  "name": "source-maps-example",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "start": "webpack-dev-server",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "css-loader": "^0.27.3",
+    "style-loader": "^0.14.1",
+    "less-loader": "^4.0.0",
+    "webpack": "^2.2.1",
+    "webpack-dev-server": "^2.4.2"
+  }
+}
diff --git a/examples/sourceMaps/webpack.config.js b/examples/sourceMaps/webpack.config.js
@@ -0,0 +1,32 @@
+module.exports = {
+  entry: require.resolve('./main.less'),
+  output: {
+    filename: 'bundle.js',
+  },
+  devtool: 'eval',
+  module: {
+    rules: [
+      {
+        test: /\.less$/,
+        use: [
+          'style-loader',
+          {
+            loader: 'css-loader',
+            options: {
+              sourceMap: true,
+            },
+          },
+          {
+            loader: require.resolve('../../dist'),
+            options: {
+              sourceMap: true,
+            },
+          },
+        ],
+      },
+    ],
+  },
+  devServer: {
+    inline: true,
+  },
+};