piral-vue 0.15.9-beta.5420 → 0.15.9-beta.5435

package/README.md

@@ -89,6 +89,65 @@ The `vue` package should be shared with the pilets via the *package.json*:
 
 :::
 
+## Development Setup
+
+For your bundler additional packages may be necessary. For instance, for Webpack the following setup is required:
+
+First, install the additional dev dependencies
+
+```sh
+npm i vue-loader@^15 @vue/compiler-sfc@^2 --save-dev
+```
+
+then add a *webpack.config.js* to use them
+
+```js
+const { VueLoaderPlugin } = require('vue-loader');
+
+module.exports = function (config) {
+  config.module.rules.push({
+    test: /\.vue$/,
+    use: 'vue-loader'
+  });
+  config.plugins.push(new VueLoaderPlugin());
+  return config;
+};
+```
+
+Now, *.vue* files are correctly picked up and handled.
+
+Alternatively, the Webpack configuration can be rather simplistic. In many cases you can use the convenience `extend-webpack` module.
+
+This is how your *webpack.config.js* can look like with the convenience module:
+
+```js
+const extendWebpack = require('piral-vue/extend-webpack');
+
+module.exports = extendWebpack({});
+```
+
+For using `piral-vue/extend-webpack` you must have installed:
+
+- `vue-loader` (at version 15)
+- `@vue/compiler-sfc^2`
+- `webpack`, e.g., via `piral-cli-webpack5`
+
+You can do that via:
+
+```sh
+npm i vue-loader@^15 @vue/compiler-sfc^2 piral-cli-webpack5 --save-dev
+```
+
+The available options for `piral-vue/extend-webpack` are the same as for the options of the `vue-loader`, e.g.:
+
+```js
+const extendWebpack = require('piral-vue/extend-webpack');
+
+module.exports = extendWebpack({
+  customElement: /\.ce\.vue$/,
+});
+```
+
 ## License
 
 Piral is released using the MIT license. For more information see the [license file](./LICENSE).

package/extend-webpack.js

@@ -0,0 +1,19 @@
+const { VueLoaderPlugin } = require('vue-loader');
+
+const vueLoader = require.resolve('vue-loader');
+
+module.exports =
+  (options = {}) =>
+  (config) => {
+    config.plugins.push(new VueLoaderPlugin());
+
+    config.module.rules.unshift({
+      test: /\.vue$/,
+      use: {
+        loader: vueLoader,
+        options,
+      },
+    });
+
+    return config;
+  };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "piral-vue",
-  "version": "0.15.9-beta.5420",
+  "version": "0.15.9-beta.5435",
   "description": "Plugin for integrating Vue@2 components in Piral.",
   "keywords": [
     "piral",
@@ -28,6 +28,9 @@
     "./convert": {
       "import": "./convert.js"
     },
+    "./extend-webpack": {
+      "require": "./extend-webpack.js"
+    },
     "./esm/*": {
       "import": "./esm/*"
     },
@@ -46,7 +49,8 @@
     "lib",
     "src",
     "convert.d.ts",
-    "convert.js"
+    "convert.js",
+    "extend-webpack.js"
   ],
   "repository": {
     "type": "git",
@@ -65,11 +69,11 @@
     "test": "echo \"Error: run tests from root\" && exit 1"
   },
   "devDependencies": {
-    "piral-core": "0.15.9-beta.5420",
+    "piral-core": "0.15.9-beta.5435",
     "vue": "^2.6.10"
   },
   "peerDependencies": {
     "vue": "^2.0.0"
   },
-  "gitHead": "a4b6f7cb2d3285e0d486c7951ad6c3d6484b11f8"
+  "gitHead": "9a36cc1b229556a4a0fcd7075cc51bdfd6190fe2"
 }