質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.46%
Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

Q&A

0回答

3846閲覧

webpackでライブラリのライセンス表記を漏れなく出力する方法

退会済みユーザー

退会済みユーザー

総合スコア0

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

0グッド

0クリップ

投稿2020/05/01 03:03

編集2020/05/01 03:03

webpackのchunkで出力される外部ライブラリのライセンス表記を確認したところ、
pixi.jsなどの一部のライブラリのライセンス表記が出力されません。

uglifyjs-webpack-pluginやterser-webpack-pluginを使用してみたのですが、記述が正しくない為かうまくいきません。どのように対処したらよいのでしょうか。

json

1・tsconfig.json 2{ 3 "compilerOptions": { 4 "target": "es3", 5 "module": "CommonJS", 6 "lib": ["dom", "esnext"], 7 "baseUrl": "./src/ts", 8 "outDir": "./dist/js", 9 "sourceMap": false, 10 "allowJs": true, 11 "alwaysStrict": true, 12 "esModuleInterop": true, 13 "forceConsistentCasingInFileNames": true, 14 "isolatedModules": true, 15 "moduleResolution": "node", 16 "noEmit": false, 17 "noFallthroughCasesInSwitch": true, 18 "noUnusedLocals": false, 19 "noUnusedParameters": false, 20 "removeComments": true, 21 "skipLibCheck": true, 22 "strict": true, 23 "noImplicitAny": false, 24 "strictNullChecks": false 25 }, 26 "compileOnSave": true, 27 "include": [ 28 "src/ts/**/*.ts" 29 ], 30 "exclude": [ 31 "node_modules", 32 ], 33}

js

1・webpack.common.js 2const path = require("path"); 3const TerserPlugin = require('terser-webpack-plugin'); 4const OptimizeCssAssetsPlugin = require("optimize-css-assets-webpack-plugin"); 5const UglifyJsPlugin = require('uglifyjs-webpack-plugin'); 6module.exports = { 7 entry: { 8 app: "./src/ts/index.ts" 9 }, 10 output: { 11 filename: "js/[name].js", 12 chunkFilename: "js/vendor.js", 13 path: path.join(__dirname, "dist") 14 }, 15 module: { 16 rules: [{ 17 test: /.ts$/, 18 use: "ts-loader", 19 exclude: /node_modules/ 20 } 21 ] 22 }, 23 optimization: { 24 minimize: true, 25 minimizer: [ 26 new UglifyJsPlugin({ 27 uglifyOptions: { 28 output: { 29 comments: /^!/, 30 } 31 } 32 }), 33 // new TerserPlugin({ 34 // extractComments: /^**!|@preserve|@license|@cc_on/i, 35 // }), 36 new OptimizeCssAssetsPlugin({}) 37 ], 38 splitChunks: { 39 cacheGroups: { 40 vendor: { 41 test: /node_modules/, 42 name: "vendor", 43 chunks: "initial", 44 enforce: true 45 } 46 } 47 } 48 }, 49 resolve: { 50 extensions: [".ts", ".js"] 51 } 52};

js

1・webpack.prod.js 2 3const merge = require('webpack-merge'); 4const common = require('./webpack.common.js'); 5module.exports = merge(common, { 6 mode: "production", 7 devtool: false, 8});

js

1・webpack.dev.js 2 3const merge = require('webpack-merge'); 4const common = require('./webpack.common.js'); 5const path = require("path"); 6module.exports = merge(common, { 7 mode: "development", 8 devServer: { 9 watchContentBase: true, 10 disableHostCheck: true, 11 contentBase: path.join(__dirname, "src"), 12 compress: true, 13 port: 8080, 14 open: true 15 }, 16 devtool: 'source-map', 17});

json

1・package.json 2{ 3 "name": "sample", 4 "version": "1.0.0", 5 "description": "", 6 "main": "index.js", 7 "scripts": { 8 "test": "echo \"Error: no test specified\" && exit 1", 9 "build": "webpack --config webpack.prod.js", 10 "dev": "webpack-dev-server --config webpack.dev.js" 11 }, 12 "author": "", 13 "license": "ISC", 14 "devDependencies": { 15 "@babel/core": "^7.6.2", 16 "@babel/preset-env": "^7.6.2", 17 "@types/gsap": "^1.20.2", 18 "@types/jest": "^25.1.3", 19 "@types/jquery": "^3.3.35", 20 "@types/pixi.js": "^4.8.7", 21 "babel-core": "^7.0.0-bridge.0", 22 "babel-jest": "^24.9.0", 23 "babel-loader": "^8.0.6", 24 "babel-preset-env": "^1.7.0", 25 "jest": "^24.9.0", 26 "jest-useragent-mock": "0.0.3", 27 "mini-css-extract-plugin": "^0.9.0", 28 "optimize-css-assets-webpack-plugin": "^5.0.3", 29 "terser-webpack-plugin": "^2.3.6", 30 "ts-jest": "^25.2.1", 31 "ts-loader": "^6.2.2", 32 "typescript": "^3.8.3", 33 "uglifyjs-webpack-plugin": "^2.2.0", 34 "webpack": "^4.42.1", 35 "webpack-cli": "^3.3.11", 36 "webpack-dev-server": "^3.10.3", 37 "webpack-merge": "^4.2.2" 38 }, 39 "dependencies": { 40 "gsap": "^3.2.0", 41 "jquery": "^3.5.0", 42 "pixi.js": "^4.8.7", 43 } 44}

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

maisumakun

2020/05/01 04:12

当該ライブラリの側の「記述が正しくない」ということはないでしょうか?
退会済みユーザー

退会済みユーザー

2020/05/01 05:40

ライブラリによって、/**や、/*!で始まるものだったりしているようです。 表記ゆれも考えて、ライブラリのコメント部分をすべて出力させるようにすればいいのではないかと考えているのですが、うまいこといきません。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.46%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問